@extends('job.layout.web')
@section('title', 'Company Registration')

@section('content')
    <style>
        .error {
            color: #d93025;
        }
    </style>
    <section class="dashboard-area">
        <div class="edit-profile-wrap container pt-3">
            <form id="companyRegisterForm" method="POST" action="{{ route('company.create.register') }}">
                @csrf
                <!-- Company Profile -->
                <div class="billing-form-item">
                    <div class="billing-title-wrap">
                        <h3 class="widget-title pb-0">Company Profile</h3>
                        <div class="title-shape margin-top-10px"></div>
                    </div>

                    <div class="billing-content">
                        <div class="contact-form-action">
                            <div class="row">

                                <!-- Full Name -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Full Name</label>
                                        <div class="form-group">
                                            <span class="la la-user form-icon"></span>
                                            <input class="form-control" type="text" name="full_name"
                                                value="{{ old('full_name') }}" placeholder="Enter full name" />
                                            <div class="error text-danger" id="error_full_name"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Official Email ID -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Official Email ID</label>
                                        <div class="form-group">
                                            <span class="la la-envelope form-icon"></span>
                                            <input class="form-control" type="text" value="{{ old('email') }}"
                                                name="email" placeholder="Enter email ID" />
                                            <div class="error text-danger" id="error_email"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Create Password -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Create Password</label>
                                        <div class="form-group">
                                            <span class="la la-lock form-icon"></span>
                                            <input class="form-control" type="text" name="password"
                                                placeholder="Enter new password" />
                                            <div class="error text-danger" id="error_password"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Mobile -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Mobile Number</label>
                                        <div class="form-group">
                                            <span class="la la-phone form-icon"></span>
                                            <input class="form-control" type="text" name="phone_number"
                                                value="{{ old('phone_number') }}" placeholder="Enter mobile number" />
                                            <div class="error text-danger" id="error_phone_number"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Company -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Company</label>
                                        <div class="form-group">
                                            <span class="la la-building-o form-icon"></span>
                                            <input class="form-control" type="text" name="company_name"
                                                value="{{ old('name') }}" placeholder="Enter company name" />
                                            <div class="error text-danger" id="error_company_name"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Number of Employees (Range) -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Number of Employees</label>
                                        <div class="form-group">
                                            <span class="la la-users form-icon"></span>
                                            <select class="form-control" name="employees">
                                                <option value="">-- Select Range --</option>
                                                <option value="1-10" {{ old('employees') == '1-10' ? 'selected' : '' }}>
                                                    1-10</option>
                                                <option value="11-50" {{ old('employees') == '11-50' ? 'selected' : '' }}>
                                                    11-50</option>
                                                <option value="51-200" {{ old('employees') == '51-200' ? 'selected' : '' }}>
                                                    51-200</option>
                                                <option value="201-500"
                                                    {{ old('employees') == '201-500' ? 'selected' : '' }}>201-500</option>
                                                <option value="501-1000"
                                                    {{ old('employees') == '501-1000' ? 'selected' : '' }}>501-1000</option>
                                                <option value="1000+" {{ old('employees') == '1000+' ? 'selected' : '' }}>
                                                    1000+</option>
                                            </select>
                                            <div class="error text-danger" id="error_employees"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Your Designation -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Your Designation</label>
                                        <div class="form-group">
                                            <span class="la la-briefcase form-icon"></span>
                                            <input class="form-control" type="text" name="designation"
                                                value="{{ old('designation') }}" placeholder="Enter designation" />
                                            <div class="error text-danger" id="error_designation"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Pincode -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Pincode</label>
                                        <div class="form-group">
                                            <span class="la la-map-pin form-icon"></span>
                                            <input class="form-control" type="text" name="pincode"
                                                value="{{ old('pincode') }}" placeholder="Enter company pincode" />
                                            <div class="error text-danger" id="error_pincode"></div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Company Address -->
                                <div class="col-lg-4">
                                    <div class="input-box">
                                        <label class="label-text">Company Address</label>
                                        <div class="form-group">
                                            <span class="la la-map-marker form-icon"></span>
                                            <input class="form-control" value="{{ old('address') }}" type="text"
                                                name="address" placeholder="Company Address" />
                                            <div class="error text-danger" id="error_address"></div>
                                        </div>
                                    </div>
                                </div>

                            </div> <!-- row -->
                        </div> <!-- contact-form-action -->
                    </div> <!-- billing-content -->
                </div> <!-- billing-form-item -->

                <div class="col-lg-12">
                    <div class="billing-title-wrap d-flex justify-content-center">
                        <button class="theme-btn border-0" type="submit">
                            Submit
                        </button>
                    </div>
                </div>
            </form>
        </div> <!-- edit-profile-wrap -->
    </section>
@endsection

@section('script')
    <script>
        $(document).ready(function() {
            $('#companyRegisterForm').on('submit', function(e) {
                e.preventDefault();

                let form = $(this);
                let actionUrl = form.attr('action');

                // Clear previous error messages
                form.find('.error').text('');

                $.ajax({
                    type: "POST",
                    url: actionUrl,
                    data: form.serialize(),
                    dataType: 'json',
                    success: function(response) {
                        if (response.message) {
                            Swal.fire({
                                icon: 'success',
                                title: 'Success',
                                text: response.message,
                                timer: 2000,
                                showConfirmButton: false
                            });

                            form[0].reset();

                            setTimeout(function() {
                                window.location.href = "/jobs";
                            }, 2000);
                        }
                    },
                    error: function(xhr) {
                        if (xhr.status === 422) {
                            var errors = xhr.responseJSON.errors;
                            $.each(errors, function(key, value) {
                                $('#error_' + key).html(value[0]);
                            });
                        } else {
                            alert("Something went wrong!");
                        }
                    }
                });
            });
        });
    </script>
@endsection