SovBundle/Resources/assets/functions/widgets.js

export class SovWidgets {

    static setSelect2($select) {
        if (typeof $select.data('select2-id') === 'undefined') {

            $select.data('init', 'set')
            var options = {
                width: "100%",
                theme: "bootstrap4",
                dropdownAutoWidth: false,
                allowClear: true,
                minimumResultsForSearch: 8
            };

            if ($select.data('allow-clear') == 'false') {
                options.allowClear = false;
            }
            if ($select.data('width')) {
                options.width = 'auto'
            }
            if ($select.find('option[value=""]')) {
                options.placeholder = $select.find('option[value=""]').html()
            }

            var myselect = $select.select2(options);

            myselect.on('select2:select', function (e) {
                var event = new Event('change');
                e.target.dispatchEvent(event);
            });
            myselect.on('select2:unselect', function (e) {
                var event = new Event('change');
                e.target.dispatchEvent(event);
            });

            return myselect;
        }
    }

    static setDateRange() {
        $('.date-time-range, .date-range').each(function (i, picker) {
            let options = {
                autoUpdateInput: false,
                locale: {
                    "format": "DD/MM/YY",
                    "separator": " - ",
                    "applyLabel": "Appliquer",
                    "cancelLabel": "Annuler",
                    "fromLabel": "Du",
                    "toLabel": "au",
                    "customRangeLabel": "Custom",
                    "daysOfWeek": ["Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa"],
                    "monthNames": ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"],
                    "firstDay": 1
                }
            };
            if ($(picker).hasClass('date-time-range')) {
                options = Object.assign(options, {
                    timePicker: true,
                    timePickerIncrement: 30,
                    timePicker24Hour: true,
                    locale: {
                        "format": "DD/MM/YYYY HH:mm",
                    }
                });
            }
            if ($(picker).nextAll('.date-time-range-fields').find('.date-start').val()) {
                options.startDate = new Date($(picker).nextAll('.date-time-range-fields').find('.date-start').val());
                options.autoUpdateInput = true;
            }
            if ($(picker).nextAll('.date-time-range-fields').find('.date-end').val()) {
                options.endDate = new Date($(picker).nextAll('.date-time-range-fields').find('.date-end').val());
                options.autoUpdateInput = true;
            }
            $(picker).daterangepicker(options);
            $(picker).on('apply.daterangepicker', function (ev, pickerElm) {
                if ($(picker).hasClass('date-time-range')) {
                    $(this).val(pickerElm.startDate.format('DD/MM/YY HH:mm') + ' - ' + pickerElm.endDate.format(options.locale.format));
                } else {
                    $(this).val(pickerElm.startDate.format('DD/MM/YY') + ' - ' + pickerElm.endDate.format(options.locale.format));
                }
                if ($(picker).hasClass('date-time-range')) {
                    $(picker).nextAll('.date-time-range-fields').find('.date-start').val(pickerElm.startDate.format('YYYY-MM-DD HH:mm'));
                    $(picker).nextAll('.date-time-range-fields').find('.date-end').val(pickerElm.endDate.format('YYYY-MM-DD HH:mm'));
                } else {
                    $(picker).nextAll('.date-time-range-fields').find('.date-start').val(pickerElm.startDate.format('YYYY-MM-DD'));
                    $(picker).nextAll('.date-time-range-fields').find('.date-end').val(pickerElm.endDate.format('YYYY-MM-DD'));
                }
            });
        });
    }

    static setAutoCompleteField() {
        var autocompleteFields = $('[data-lc-autocomplete-url]');
        autocompleteFields.each(function () {
            var $this = $(this),
                url = $this.data('lc-autocomplete-url');

            $this.autoComplete({
                //bootstrapVersion: 4,
                //noResultsText: 'Aucun résultat n\'a été trouvé.',
                resolverSettings: {
                    url: url
                }
            });
        });
    }
}