@component('Components.demoWarning') @endcomponent
<form class="setDefaultForm">
    <div class="setDefault">
        <h2>{{ _t('profile.set_default_language&currency') }}</h2>
        <div class="formField row">
            <div class="col-sm-4">
                <label>{{ _t('profile.set_default_language') }}</label>
            </div>
            <div class="col-sm-8">
                <select name="language">
                    @foreach($languages as $language)
                        <option @if($userData->language == $language->code) selected
                                @endif value="{{ $language->code }}">{{ $language->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="formField row">
            <div class="col-sm-4">
                <label>{{ _t('profile.set_default_currency') }}</label>
            </div>
            <div class="col-sm-8">
                <select name="currency">
                    @foreach($currencies as $currency)
                        <option @if($userData->currency == $currency->code) selected
                                @endif value="{{ $currency->code }}">{{ $currency->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div>
            <button type="button" class="btn primaryButton ladda-button saveDefault"
                    data-style="contract">{{ _t('profile.save') }}</button>
        </div>
        <div class="errorWrapper" style="display: none"></div>
    </div>
</form>
<script type="text/javascript">
    $(function () {
        Ladda.bind('.ladda-button');
        $('select').select2({
            width: '50%'
        });

        $('.saveDefault').click(function () {
            let errorWrapper = $('.errorWrapper').slideUp().empty();

            $.post('{{ scopeRoute("defaultSettings.save") }}', $('.setDefaultForm').serialize(), function () {
                toastr.success(" Saved ");
                Ladda.stopAll();
            }).fail(function (response) {
                Ladda.stopAll();
                let errors = response.responseJSON;

                for (let key in errors)
                    errorWrapper.append('<div class="error">' + errors[key] + '</div>');

                errorWrapper.slideDown();
            });
        });
    });

</script>
<style>
    .setDefault h2 {
        color: #578ebe !important;
        font-weight: 700;
        text-transform: uppercase;
        border-bottom: 1px dotted #ddd;
        padding-bottom: 11px;
        margin-bottom: 10px;
    }

    .setDefault h2 {
        margin-top: 7px !important;
        font-size: 18px !important;
    }

    .setDefault .securityPinResetForm {

    }

    .setDefault .errorWrapper {
        border: none;
        border-radius: 3px !important;
        font-size: 13px;
        max-width: 500px;
        background: #e13e3e;
        margin-top: 10px !important;
        color: #fff;
        padding: 0;
        margin: 0;
    }

    .setDefault .errorWrapper .error {
        font-size: 12px;
        padding: 4px 7px;
    }

    .row.profileContact .partialContent form.setDefaultForm {
        padding: 12px 20px 15px !important;
    }

    .row.profileContact .partialContent form.setDefaultForm .formField.row {
        padding: 8px 0 !important;
    }
</style>