@extends('frontend.layouts.master')

@section('page_title')
    {{ __('business.create.title') }}
@endsection

@section('head')
@endsection

@section('content-wrapper')
    @if(view()->exists('tenants.' . $currentCompany->code . '.frontend.business.create-portada' ))
        @include('tenants.' . $currentCompany->code . '.frontend.business.create-portada')
    @else
    <div class="py-5 text-center align-items-center d-flex portada jarallax no-image" style="">
        <div class="tinte2"></div>
        <div class="container py-5">
            <div class="row text-center">
                <div class="col-lg-12 col-md-12 col-12 col-sm-12">
                    <h1 class="display-4 mb-4 text-white">
                        {{ __('business.create.title') }}
                    </h1>
                </div>
            </div>
        </div>
    </div>
    @endif
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb d-flex justify-content-center">
            <li class="breadcrumb-item s-text"><a href="{{ route('frontend.home.index') }}">{{ __('frontend-menu.home') }}</a></li>
            <li class="breadcrumb-item s-text active" aria-current="page">{{ __('business.create.title') }}</li>
        </ol>
    </nav>

    <div class="section py-5">
       <div class="container my-5">
            <div class="row d-flex justify-content-center">
                <div class="col-12 text-center">  
                    <h2 class="text-primary-color">{{ __('business.register-spr.header_title') }}</h2>                                      
                </div>
            </div>

            <div class="row d-flex justify-content-center mt-4">
                <div class="col-md-3 text-center">
                    <img class="thumb-350 mb-2" src="{{ asset('tenants/cambrabcn/images/adhesio-campanya.png') }}">
                    <p>{{ __('business.register-spr.adhesion_text') }} <span class="text-primary-color"><b>{{ __('business.register-spr.adhesion_date') }}</b></span></p>
                </div>

                <!-- <div class="col-md-3 text-center">
                    <img class="thumb-350 mb-2" src="{{ asset('tenants/cambrabcn/images/inici-campanya.png') }}">
                    <p>{{ __('business.register-spr.start_text') }} <span class="text-primary-color"><b>{{ __('business.register-spr.start_date') }}</b></span></p>
                </div> -->

                <div class="col-md-3 text-center">
                    <img class="thumb-350 mb-2" src="{{ asset('tenants/cambrabcn/images/caducitat-bons.png') }}">
                    <p>{{ __('business.register-spr.expiry_text') }} <span class="text-primary-color"><b>{{ __('business.register-spr.expiry_days') }}</b></span></p>
                </div>

                <!-- <div class="col-md-3 text-center">
                    <img class="thumb-350 mb-2" src="{{ asset('tenants/cambrabcn/images/final-campanya.png') }}">
                    <p>{{ __('business.register-spr.end_text') }} <span class="text-primary-color"><b>{{ __('business.register-spr.end_date') }}</b></span></p>
                </div> -->
            </div>            
        </div>
 
        <div class="container my-5">
            <div class="row d-flex justify-content-center">
                <div class="col-lg-10 ">
                    <h2 class="text-primary-color mb-3 text-center">{{ __('business.register-spr.title') }}</h2>
                    <p class="text-center">{{ __('business.register-spr.description') }}</p>

                    <h3 class="text-primary-color mt-4 text-center">{{ __('business.register-spr.requirements_title') }}</h3>
                    <ul class="business-requisits">
                        <li>{{ __('business.register-spr.requirement_1') }}</li>
                        <li>{{ __('business.register-spr.requirement_2') }}</li>
                        <li>{{ __('business.register-spr.requirement_3') }}</li>
                        <li>{{ __('business.register-spr.requirement_4') }}</li>
                        <li>{{ __('business.register-spr.requirement_5') }}</li>
                        <li>{{ __('business.register-spr.requirement_6') }}</li>
                        <li>{{ __('business.register-spr.requirement_7') }}</li>
                    </ul>

                    <!-- <p class="mt-3 fw-bold text-center">{{ __('business.register-spr.request_period') }}</p> -->
                </div>
            </div>
        </div>
      
    </div>
    <div class="section py-5 bg-light">
        <div class="container">        
            <div class="row mt-4 d-flex justify-content-center ">
                <div class="col-lg-8  col-md-12">
                    <h3 class="text-primary-color"></h3>
                    <div class="pb-4">
                        <form class="login-register" enctype="multipart/form-data" method="post" action="{{ route('frontend.business.store') }}" @submit.prevent="onSubmit">

                            {{ csrf_field() }}

                            <p class="mb-4 s-text"><span style="color: red;font-size: 18px; ">*</span> {{ __('account.register.required-fields') }}</p>

                            <p class="mt-2 business-register-p-data-title">{{ __('business.register.commercial-data') }}</p>

                            <div class="form-group mb-4" :class="[errors.has('commercial_name') ? 'has-error' : '']">
                                <label class="form-label required" for="commercial_name">{{ __('business.register.commercial-name') }}</label>
                                <input type="text" name="commercial_name" value="{{ old('commercial_name') }}" id="commercial_name" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.commercial-name') }}&quot;" />
                                <span class="control-error" v-if="errors.has('commercial_name')">@{{ errors.first('commercial_name') }}</span>
                            </div>

                            <div class="form-row">
                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('category') ? 'has-error' : '']">
                                        <label class="form-label required" for="category">{{ __('business.register.category') }}</label>
                                        <select  name="category" id="category" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.category') }}&quot;">
                                            <option value="" ></option>
                                            @foreach($categories as $category)
                                                <option value="{{ $category['idSector'] }}" {{ ($category['idSector'] == old('category') ? 'selected' : '') }} value="{{ $category['idSector'] }}">{{ $category['nom'] }}</option>
                                            @endforeach
                                        </select>
                                        <span class="control-error" v-if="errors.has('category')">@{{ errors.first('category') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('subcategory') ? 'has-error' : '']">
                                        <label class="form-label required" for="subcategory">{{ __('business.register.subcategory') }}</label>
                                        <select  name="subcategory" id="subcategory" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.subcategory') }}&quot;">
                                        </select>
                                        <span class="control-error" v-if="errors.has('subcategory')">@{{ errors.first('subcategory') }}</span>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="form-row">
                                
                                <div class="col-md-4 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('road_type') ? 'has-error' : '']">
                                        <label class="form-label required" for="road_type">{{ __('business.register.road-type') }}</label>
                                        <select  name="road_type" id="road_type" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.road-type') }}&quot;">
                                            <option value="" ></option>
                                            @foreach($roadTypes as $roadType)
                                                <option value="{{ $roadType['id'] }}" {{ ($roadType['id'] == old('road_type') ? 'selected' : '') }} value="{{ $roadType['id'] }}">{{ $roadType['name'] }}</option>
                                            @endforeach
                                        </select>
                                        <span class="control-error" v-if="errors.has('road_type')">@{{ errors.first('road_type') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-4 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('road_name') ? 'has-error' : '']">
                                        <label class="form-label required" for="road_name">{{ __('business.register.road-name') }}</label>
                                        <input type="text" name="road_name" value="{{ old('road_name') }}" id="road_name" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.road-name') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('road_name')">@{{ errors.first('road_name') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-4 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('road_number') ? 'has-error' : '']">
                                        <label class="form-label required" for="road_number">{{ __('business.register.road-number') }}</label>
                                        <input type="text" name="road_number" value="{{ old('road_number') }}" id="road_number" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.road-number') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('road_number')">@{{ errors.first('road_number') }}</span>
                                    </div>
                                </div>

                            </div>

                            <div class="form-row">
                                
                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('postcode') ? 'has-error' : '']">
                                        <label class="form-label required" for="postcode">{{ __('business.register.postcode') }}</label>
                                        <input type="text" name="postcode" value="{{ old('postcode') }}" id="postcode" v-validate="'required|numeric|digits:5'" class="form-control" data-vv-as="&quot;{{ __('business.register.postcode') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('postcode')">@{{ errors.first('postcode') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('location') ? 'has-error' : '']">
                                        <label class="form-label required" for="location">{{ __('business.register.location') }}</label>
                                        <select  name="location" id="location" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.location') }}&quot;">
                                            <option value=""></option>
                                        </select>
                                        <span class="control-error" v-if="errors.has('location')">@{{ errors.first('location') }}</span>
                                    </div>
                                </div>

                            </div>                        
                            <div class="form-row">

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('fiscal_name') ? 'has-error' : '']">
                                        <label class="form-label required" for="fiscal_name">{{ __('business.register.fiscal-name') }}</label>
                                        <input type="text" name="fiscal_name" value="{{ old('fiscal_name') }}" id="fiscal_name" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.fiscal-name') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('fiscal_name')">@{{ errors.first('fiscal_name') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('nif') ? 'has-error' : '']">
                                        <label class="form-label required" for="nif">{{ __('business.register.nif') }}</label>
                                        <input type="text" name="nif" value="{{ old('nif') }}" id="nif" v-validate="'required|alpha_num|length:9'" class="form-control" data-vv-as="&quot;{{ __('business.register.nif') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('nif')">@{{ errors.first('nif') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('nibanf') ? 'has-error' : '']">
                                        <label class="form-label required" for="nif">{{ __('business.register.iban') }}</label>
                                        <input type="text" name="iban" value="{{ old('iban') }}" id="iban" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.iban') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('iban')">@{{ errors.first('iban') }}</span>
                                    </div>
                                </div>

                            </div>

                            <p class="mt-2 business-register-p-data-title">{{ __('business.register.personal-data') }}</p>

                            <div class="form-row">

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('personal_name') ? 'has-error' : '']">
                                        <label class="form-label required" for="personal_name">{{ __('business.register.personal-name') }}</label>
                                        <input type="text" name="personal_name" value="{{ old('personal_name') }}" id="personal_name" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.personal-name') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('personal_name')">@{{ errors.first('personal_name') }}</span>
                                    </div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('personal_last_name') ? 'has-error' : '']">
                                        <label class="form-label required" for="personal_last_name">{{ __('business.register.personal-last-name') }}</label>
                                        <input type="text" name="personal_last_name" value="{{ old('personal_last_name') }}" id="personal_last_name" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.personal-last-name') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('personal_last_name')">@{{ errors.first('personal_last_name') }}</span>
                                    </div>
                                </div>
                            </div>

                            <div class="form-row">

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('personal_email') ? 'has-error' : '']">
                                        <label class="form-label required" for="personal_email">{{ __('business.register.personal-email') }}</label>
                                        <input type="email" name="personal_email" value="{{ old('personal_email') }}" id="personal_email" v-validate="'required|email'" class="form-control" data-vv-as="&quot;{{ __('business.register.personal-email') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('personal_email')">@{{ errors.first('personal_email') }}</span>
                                    
                                        <div class="form-check mb-2">
                                            <input class="form-check-input" type="checkbox" id="email_duplicated" name="email_duplicated">
                                            <label class="form-check-label s-text" for="email_duplicated">
                                                {{ __('business.register.personal-email-other-sellers') }}
                                            </label>
                                        </div>
                                    
                                    </div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <div class="form-group mb-4" :class="[errors.has('personal_phone') ? 'has-error' : '']">
                                        <label class="form-label required" for="personal_phone">{{ __('business.register.personal-phone') }}</label>
                                        <input type="text" name="personal_phone" value="{{ old('personal_phone') }}" id="personal_phone" v-validate="'required'" class="form-control" data-vv-as="&quot;{{ __('business.register.personal-phone') }}&quot;" />
                                        <span class="control-error" v-if="errors.has('personal_phone')">@{{ errors.first('personal_phone') }}</span>
                                    </div>
                                </div>
                            </div>                        

                            <p class="mt-2 business-register-p-data-title">{{ __('business.register.access-data') }}</p>

                            <div class="form-group mb-4" :class="[errors.has('access_user') ? 'has-error' : '']">
                                <label class="form-label required" for="access_user">{{ __('business.register.access-user') }}</label>
                                <input type="text" name="access_user" value="{{ old('access_user') }}" id="access_user" v-validate="'required|alpha_dash'" class="form-control" data-vv-as="&quot;{{ __('business.register.access-user') }}&quot;" />
                                <span class="control-error" v-if="errors.has('access_user')">@{{ errors.first('access_user') }}</span>
                            </div>

                            <div class="form-group mb-4" :class="[errors.has('password') ? 'has-error' : '']">
                                <label class="form-label required" for="password">{{ __('business.register.password') }}</label>
                                <div class="input-group">
                                    <input type="password" ref="password" value="{{ old('password') }}" name="password" v-validate="'required|min:8'" id="password" class="form-control" data-vv-as="&quot;{{ __('business.register.password') }}&quot;" />
                                    <div class="input-group-prepend">
                                        <div class="input-group-text"><i class="fa fa-eye"></i></div>
                                    </div>
                                </div>
                                <span class="control-error" v-if="errors.has('password')">@{{ errors.first('password') }}</span>
                            </div>

                            <div class="form-group mb-4" :class="[errors.has('password_confirmation') ? 'has-error' : '']">
                                <label class="form-label required" for="password_confirmation">{{ __('business.register.password_confirmation') }}</label>
                                <div class="input-group">
                                    <input type="password" value="{{ old('password_confirmation') }}" name="password_confirmation" v-validate="'required|min:8|confirmed:password'" id="password_confirmation" class="form-control" data-vv-as="&quot;{{ __('business.register.password_confirmation') }}&quot;" />
                                    <div class="input-group-prepend">
                                        <div class="input-group-text"><i class="fa fa-eye"></i></div>
                                    </div>
                                </div>
                                <span class="control-error" v-if="errors.has('password_confirmation')">@{{ errors.first('password_confirmation') }}</span>
                            </div>

                            {!! RecaptchaV3::field('register_seller_moneder', 'g-recaptcha-response') !!}
                            
                            @if(sizeof($extraFields)>0)                                                 
                                @foreach($gruposPreparados as $grupo)
                                    {{-- Título del grupo si existe --}}
                                    @if($grupo['titulo'])
                                        <p class="mt-2 business-register-p-data-title">{{ $grupo['titulo'] }}</p>
                                    @else
                                        <p class="mt-2 business-register-p-data-title">{{ __('business.register.extra-fields') }}</p>                                        
                                    @endif
                                    <div class="form-row">           
                                    {{-- Campos del grupo --}}
                                    @foreach($grupo['campos'] as $campo)
                                        @include('tenants.cambrabcn.frontend.business.partials.campo-' . $campo['type'], ['campo' => $campo])
                                    @endforeach
                                    </div>
                                @endforeach                        
                            @endif

                            <div class="form-check mt-2" :class="[errors.has('cond') ? 'has-error' : '']">
                                                
                                <input type="checkbox" v-validate="'required'" name="cond" class="form-check-input" id="conditions" data-vv-as="&quot;{{ __('business.register.access-cond-inter') }}&quot;">
                                <label for="conditions" class="form-check-label mandatory">{{ __('business.register.access-cond-first') }}                                 
                                    <a target="_blank" href="{{ 

                                        (isset($infoAsso['file_cond_est']) && $infoAsso['file_cond_est'] != '') ? 
                                        $currentCompany->moneder_intranet . '/uploads/CondicionsUs/' . $infoAsso['file_cond_est']
                                        :
                                        __('business.register.link-cond') 
                                        
                                        }}">{{ __('business.register.access-cond-inter') }}</a>
                                    {{ __('business.register.access-cond-last') }}
                                </label>
                                <br>
                                <span class="control-error" v-if="errors.has('validesadades')">@{{ errors.first('validesadades') }}</span>
                            </div>
                            <div class="form-check mt-2" :class="[errors.has('validesadades') ? 'has-error' : '']">
                                                
                                <input type="checkbox" v-validate="'required'" name="validesadades" class="form-check-input" id="conditions" data-vv-as="&quot;{{ __('business.register.access-valides-dades') }}&quot;">
                                <label for="conditions" class="form-check-label mandatory">{{ __('business.register.access-valides-dades') }}</label>
                                <br>
                                <span class="control-error" v-if="errors.has('validesadades')">@{{ errors.first('validesadades') }}</span>
                            </div>

                            <!-- Submit button -->
                            <button type="submit" class="site-btn link wow bounceInUp btn-block mt-4 mb-4">{{ __('business.register.submit') }}</button>

                            <!-- Register buttons -->
                            <div class="text-center">
                                <p>{{ __('business.register.pre-login') }} <a target="_blank" href="{{ $currentCompany->moneder_intranet }}">{{ __('business.register.login') }}</a></p>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>    
    </div>
@endsection

@push('scripts')
<script>
    
    var categories = @json($categories);

    var categoryId = ('{{ old("category") }}' != '') ? '{{ old("category") }}' : '';
    var subcategoryId = ('{{ old("subcategory") }}' != '') ? '{{ old("subcategory") }}' : '';
    var postcode = ('{{ old("postcode") }}' != '') ? '{{ old("postcode") }}' : '';
   var locationInput = ('{{ old("location") }}' != '') ? '{{ old("location") }}' : '';

    
    console.log(categories);

    if(categoryId != ''){
        var html = '';
        categories[categoryId].subsectors.forEach(element => {
            html += `<option ${(element.idSector == subcategoryId) ? 'selected' : ''} value="${element.idSector}" >${element.nom}</option>`;
        });
        $('#subcategory').html(html);
    }

    if(postcode != ''){
        getLocations(postcode);
    }

    function getLocations(postcode = ''){

        if(postcode.length != 5){return;} 

        $.ajax({
            type: 'POST',
            url: '/moneder-get-locations',
            data: {
                postcode: postcode
            },
            async: false,
            dataType: 'json',
            contentType: "application/x-www-form-urlencoded;charset=utf-8",

            success: function (json) {
                console.log(json);
                var html = '';
                json.forEach(element => {
                    html += `<option ${(element.geonameid == locationInput) ? 'selected' : ''} value="${element.geonameid}" >${element.name}</option>`;
                });
                $('#location').html(html);
            },

            error: function (e) {
                alert(e.message);
            },

            complete: function () {}
        });
    }


    $(document).ready(function () {

        $('#category').change(function () {

            categoryId = $(this).val();

            console.log('categoryId', categoryId);
            var html = '';

            if(categoryId != ''){
                categories.forEach(element => {
                    if(element.idSector == categoryId){
                        element.subsectors.forEach(element2 => {
                            html += `<option value="${element2.idSector}" >${element2.nom}</option>`;
                        })
                    }
                });               
            }
            
            $('#subcategory').html(html);

        });

        $('#postcode').change(function () {
            postcode = $(this).val();

            getLocations(postcode);
        });

    });
    

</script>

<script>

    var viewPass = false;
    $(window).ready(function () {
    
        $('.input-group-text').click(function() {
    
            if(!viewPass){
                $('#password_confirmation').attr('type', 'text');
                $('#password').attr('type', 'text');
                $('.fa-eye').addClass('fa-eye-slash');
                $('.fa-eye').removeClass('fa-eye');
            } else {
                $('#password_confirmation').attr('type', 'password');
                $('#password').attr('type', 'password');
                $('.fa-eye-slash').addClass('fa-eye');
                $('.fa-eye-slash').removeClass('fa-eye-slash');
            }
    
            viewPass = !viewPass;
    
        });
    
    });
    
    </script>


@endpush