<div class="card mb-4">
    <h5 class="card-header">
        {{ __('Vertrag & Datenschutz') }}
        <span class="text-tiny float-right">* {{trans('register.required_fields')}}</span>
    </h5>
    <div class="card-body">
        <div class="form-group">
            <label class="custom-control custom-checkbox m-0">
                <input type="checkbox" class="custom-control-input" name="accepted_data_protection" id="accepted_data_protection" @if($user->account && $user->account->data_protection) checked="checked" @endif>
                <span class="custom-control-label">{!!  __('I have read the :link and accept it.*', ['link' => '<a href="#" class="update_modal_data_load" data-url="'.route('loading_modal').'" data-data="data_protection" data-target="#modal-loading">'.__('data protection').'</a>'])  !!}</span>
            </label>
        </div>

        <div class="form-group">
            <label class="custom-control custom-checkbox m-0">
                <input type="checkbox" class="custom-control-input" name="accepted_active" id="accepted_active" @if($user->agreement) checked="checked" @endif required>
                <span class="custom-control-label">{!!  trans('register.declaration-of-consent')  !!}*</span>
            </label>
        </div>

        <div class="container-p-x py-4 bg-light rounded mb-2" >
            <div class="" style="max-height: 400px; overflow-y: auto">
               {!! File::get(public_path('pdf/gs_contract_de.php')); !!}
            </div>
        </div>

        <div class="form-group">
            <label class="custom-control custom-checkbox m-0">
                <input type="checkbox" class="custom-control-input" name="accepted_contract" id="accepted_contract" required @if($user->account && $user->account->accept_contract) checked="checked" @endif>
                <span class="custom-control-label">{!! trans('register.accept-contract') !!}*</span>
            </label>
        </div>

    </div>
</div>

<script type="application/javascript">
    $( document ).ready(function() {

        // Set up validator
        $('#lead-form-validation-confirm').validate({
            rules: {
                'accepted_data_protection': {
                    required: true
                },
                'accepted_active': {
                    required: true
                },
                'accepted_contract': {
                    required: true
                },
            },
            errorPlacement: function errorPlacement(error, element) {
                $(element).parents('.form-group').append(
                    error.addClass('invalid-feedback small d-block')
                )
            },
            highlight: function (element) {
                if ($(element).hasClass('selectpicker')) {
                    $(element).parent().addClass('is-invalid');
                }
                $(element).addClass('is-invalid');
            },
            unhighlight: function (element) {
                $(element).removeClass('is-invalid');
                $(element).parents('.form-group').find('.is-invalid').removeClass('is-invalid');
            },
            messages :  {
                required: "{{__('This field is required.')}}",
                accepted_data_protection : {
                    required: "{{__('This field is required.')}}",
                },
                accepted_active : {
                    required: "{{__('This field is required.')}}",
                },
                accepted_contract : {
                    required: "{{__('This field is required.')}}",
                },

            },
            onkeyup: false
        });

    });

</script>

