/**
 * Operation Select js in operationSelect.html
 *
 * @since cms:1.4.3.2&1.4.3.3 web:1.0
 */
var NotificationSelect = {};

NotificationSelect.nameSelected = '';
NotificationSelect.valueSelected = '';
/**
 * default operation select data JSON
 */
NotificationSelect.defaultNotificationSelectJson = [];

/**
 * get operation select data from cms
 * @param {function} callback
 */
NotificationSelect.getNotificationSelectData = function (callback) {
    let param = {
        sid: COMMON.getSid(),
    };
    const url = COMMON.format(ClientData.conf_checkApiUrl(), ClientData.userInfo_accountPath()) + CONSTANT.URL.CMS.API.PUSH_MESSAGE_TEMPLATE;
    COMMON.cmsAjax(
        url,
        param,
        false,
        function (json) {
            if (callback) {
                callback(json);
            }
        },
        function () {
            console.log('NotificationSelect.getNotificationSelectData error');
            if (callback) {
                callback(NotificationSelect.defaultNotificationSelectJson);
            }
        },
    );
};

/**
 * handle click operation setting
 */
NotificationSelect.selectOperationClick = function () {
    $('.select-card-list .card .select-label').on('click', function () {
        $(this).closest('.select-card-list').find('.card').removeClass('selected');
        $(this).closest('.card').addClass('selected');
        NotificationSelect.nameSelected = $(this).text();
        NotificationSelect.valueSelected = $(this).closest('.accordion').find('.card-body').text();
    });
};

/**
 * init data, action when screen onload
 * @param selectedCallback
 */
NotificationSelect.init = function (selectedCallback) {
    NotificationSelect.getNotificationSelectData(function (data) {
        if (typeof data === 'undefined' || data == null) return;
        NotificationSelect.createNotificationSelectList(data.pushMessageTemplate);
    });
    NotificationSelect.selectOperationClick();
    NotificationSelect.changeSelectCallback = selectedCallback;
};

/**
 * Implement notification select html
 * @param pushMessageTemplate
 * @returns
 */
NotificationSelect.createNotificationSelectList = function (pushMessageTemplate) {
    $('#notificationSelectList').empty();
    if (typeof pushMessageTemplate === 'undefined' || pushMessageTemplate.length < 1) return;
    let classSelected = 'selected';
    for (let i = 0; i < pushMessageTemplate.length; i++) {
        let divName = $("<div class='pl-5 py-3 h-100 w-100 align-self-center select-label'>" + pushMessageTemplate[i].name + '</div>');
        let divIcon = $(
            "<div class='flex-shrink-1 mx-3 align-self-center'>" +
                "<button class='btn btn-link border collapsed' type='button' data-toggle='collapse' data-target='#collapse" +
                i +
                "' aria-expanded='true' aria-controls='collapse" +
                i +
                "'>" +
                "<div class='arrow-icon'></div>" +
                '</button></div>',
        );

        let ahrefName = $("<a href='#' class='d-flex text-decoration-none'></a>");
        let divParentName = $("<div class='card mb-2 " + classSelected + "' id='heading" + i + "'></div>");
        classSelected = '';

        let divValue = $("<div id='collapse" + i + "' class='collapse' aria-labelledby='heading" + i + "' data-parent='#accordion" + i + "'></div>");
        let divBodyValue = $("<div class='card-body'>" + pushMessageTemplate[i].value + '</div>');

        let messageli = $("<li class='accordion' id='accordion" + i + "'></li>");

        ahrefName.append(divName);
        ahrefName.append(divIcon);
        divParentName.append(ahrefName);
        divValue.append(divBodyValue);
        messageli.append(divParentName);
        messageli.append(divValue);
        if (i == 0) {
            NotificationSelect.nameSelected = pushMessageTemplate[i].name;
            NotificationSelect.valueSelected = pushMessageTemplate[i].value;
        }
        $('#notificationSelectList').append(messageli);
    }
};

/**
 * handle click event of select button
 */
NotificationSelect.onClickTempalte = function () {
    NotificationSelect.chooseTemplate();
};

/**
 * Get operation select and call back function in main page
 */
NotificationSelect.chooseTemplate = function () {
    let param = {};
    param.nameSelected = NotificationSelect.nameSelected;
    param.valueSelected = NotificationSelect.valueSelected;
    NotificationSelect.closeModal();
    if (NotificationSelect.changeSelectCallback && typeof NotificationSelect.changeSelectCallback === 'function') {
        NotificationSelect.changeSelectCallback(param.valueSelected);
    }
};

/**
 * close setting dialog
 */
NotificationSelect.closeModal = function () {
    $('#select-template-modal .close').click();
};
