@extends('web.layouts.layout')

@section('content')

    <main>
        <!-- Start section -->
        <section class="about-sec content-pg job-det section">
            <div class="container">
                <div class="main_inner p-0">
                    <div class="imgBox">
                        <img src="{{ getImage($career->image) }}" alt="{{ $career->currentDescription->name }}" class="sec-img"/>
                    </div>
                    <div class="text_box">
                        <div class="head_txt d-flex align-items-center mb-5">
                            <h1 class="title fw-bold mb-0 wow focus-in-expand-fwd ms-0">
                                {{ $career->currentDescription->name }}
                            </h1>
                        </div>
                        <div class="txt wow fadeInUp">
                            <div class="row justify-content-between">
                                <div class="col-lg-12 career-details">
                                    {!! nl2br($career->currentDescription->description) !!}
                                </div>
                            </div>
                        </div>
                        <div class="form_box mt-5">
                            <form method="post" action="{{route('career.store')}}" enctype="multipart/form-data">
                                @csrf
                                <h4 class="title fs-2 mb-4 fw-bold wow focus-in-expand-fwd">
                                    {{ __('careers.apply_for_job') }}
                                </h4>
                                <div class="row wow fadeInUp">
                                    <div class="col-lg-5">
                                        <div class="form-group mb-4">
                                            <input name="name" value="{{ old('name') }}"
                                                   class="form-control {{ $errors->has('name') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('main.name') }}" type="text" required/>
                                        </div>
                                        <div class="form-group mb-4">
                                            <input name="email" value="{{ old('email') }}"
                                                   class="form-control {{ $errors->has('email') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('main.email') }}" type="email" required/>
                                        </div>
                                        <div class="form-group mb-4">
                                            <input name="phone" value="{{ old('phone') }}"
                                                   class="form-control {{ $errors->has('phone') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('main.phone') }}" type="number" required/>
                                        </div>
                                    </div>
                                    <div class="col-lg-7">
                                        <div class="cv_uploading_box justify-content-center d-flex align-items-center">
                                            <img src="{{asset('assets/web/images/icons/upload_file.svg')}}" alt="" class="icon"/>
                                            <div class="upload_txt">
                                                <h5 class="label fs-5 mb-3">{{ __('careers.upload_resume') }}</h5>
                                                <div class="upload-main-wrapper me-3">
                                                    <div class="upload-wrapper">
                                                        <input type="file" name="cv" id="upload-file" required>
                                                        <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid meet" viewBox="224.3881704980842 176.8527621722847 221.13266283524905 178.8472378277154" width="221.13" height="178.85"><defs><path d="M357.38 176.85C386.18 176.85 409.53 204.24 409.53 238.02C409.53 239.29 409.5 240.56 409.42 241.81C430.23 246.95 445.52 264.16 445.52 284.59C445.52 284.59 445.52 284.59 445.52 284.59C445.52 309.08 423.56 328.94 396.47 328.94C384.17 328.94 285.74 328.94 273.44 328.94C246.35 328.94 224.39 309.08 224.39 284.59C224.39 284.59 224.39 284.59 224.39 284.59C224.39 263.24 241.08 245.41 263.31 241.2C265.3 218.05 281.96 199.98 302.22 199.98C306.67 199.98 310.94 200.85 314.93 202.46C324.4 186.96 339.88 176.85 357.38 176.85Z" id="b1aO7LLtdW"></path><path d="M306.46 297.6L339.79 297.6L373.13 297.6L339.79 255.94L306.46 297.6Z" id="c4SXvvMdYD"></path><path d="M350.79 293.05L328.79 293.05L328.79 355.7L350.79 355.7L350.79 293.05Z" id="b11si2zUk"></path></defs><g><g><g><use xlink:href="#b1aO7LLtdW" opacity="1" fill="#ffffff" fill-opacity="1"></use></g><g><g><use xlink:href="#c4SXvvMdYD" opacity="1" fill="#363535" fill-opacity="1"></use></g><g><use xlink:href="#b11si2zUk" opacity="1" fill="#363535" fill-opacity="1"></use></g></g></g></g></svg>
                                                        <span class="file-upload-text">{{ __('careers.browse') }}</span>
                                                        <div class="file-success-text">
                                                            <svg version="1.1" id="check" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                                                                 viewBox="0 0 100 100"  xml:space="preserve">
                                                                <circle style="fill:rgba(0,0,0,0);stroke:#001F6F;stroke-width:10;stroke-miterlimit:10;" cx="49.799" cy="49.746" r="44.757"/>
                                                                <polyline style="fill:rgba(0,0,0,0);stroke:#001F6F;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;" points="
                                                                27.114,51 41.402,65.288 72.485,34.205 "/>
                                                            </svg>
                                                            <span>{{ __('careers.successfully') }}</span>
                                                        </div>
                                                    </div>
                                                    <p id="file-upload-name"></p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mt-4">
                                        <button type="submit" class="butn secondary_butn py-3 fs-6"><b> {{ __('careers.apply_now') }}</b></button>
                                    </div>
                                </div>
                                <input type="hidden" name="career_id" value="{{ $career->id }}">
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </main>

@endsection

@section('js')

    <script>
        $(document).ready(function(){
            $('#upload-file').change(function() {
                var filename = $(this).val();
                $('#file-upload-name').html(filename);
                if(filename!=""){
                    setTimeout(function(){
                        $('.upload-wrapper').addClass("uploaded");
                    }, 600);
                    setTimeout(function(){
                        $('.upload-wrapper').removeClass("uploaded");
                        $('.upload-wrapper').addClass("success");
                    }, 1600);
                }
            });
        });
    </script>

@endsection