import axios from "axios";

const entityId = document.getElementById('entityId');
const bitrixStatus = document.getElementById('bitrixStatus');
const listId = document.getElementById('listId');
const withUnsubscribe = document.getElementById('withUnsubscribe');
const createResultText = document.getElementById('createResultText');
const createSyncButton = document.getElementById('createSync');

const createSync = () => {
    const json = {};

    if (entityId.value) {
        json.entity_id = entityId.value;
    }
    if (bitrixStatus.value) {
        json.bitrix_status = bitrixStatus.value;
    }
    if (listId.value) {
        json.active_campaign_list_id = listId.value;
    }

    json.with_unsubscribe = withUnsubscribe.checked;

    axios.post('/admin/sync/create', json)
        .then(function (response) {
            window.location.href = '/admin';
            console.log(response);
        })
        .catch(function (error) {
            console.log(error.response.data.message);
        });
}

const filterStatus = () => {
    const entity = entityId.value;

    const leadInfo = document.getElementById('leadInfo');
    leadInfo.classList.toggle('hidden', 'STATUS' !== entity)

    bitrixStatus.value = '';
    bitrixStatus.classList.toggle('hidden', !entity)
    const items = document.querySelectorAll('.filter-DEAL_STAGE, .filter-STATUS');
    items.forEach(function (item) {
        item.classList.toggle('hidden', !item.classList.contains('filter-' + entity));
    });
    updateCreateResultText()
}

const updateCreateResultText = () => {
    let selectedCount = 0;
    let needShow = false;
    let msg = 'Sync';

    console.log();

    if (entityId.value) {
        selectedCount++;
        needShow = true;
        msg += ' "<strong>' + entityId.querySelector('option:checked').textContent + '</strong>"';
    }
    if (bitrixStatus.value) {
        selectedCount++;
        needShow = true;
        msg += ' with status "<strong>' + bitrixStatus.querySelector('option:checked').textContent + '</strong>"';
    }
    if (listId.value) {
        selectedCount++;
        needShow = true;
        msg += ' to list "<strong>' + listId.querySelector('option:checked').textContent + '</strong>"';
    }
    if (withUnsubscribe.checked) {
        needShow = true;
        msg += ' with <strong>unsubscribe deleted</strong>';
    }

    createSyncButton.classList.toggle('disabled', selectedCount !== 3);

    createResultText.innerHTML = needShow ? msg : '';
    createResultText.classList.toggle('hidden', !needShow);
}

entityId.addEventListener('change', filterStatus);
bitrixStatus.addEventListener('change', updateCreateResultText);
listId.addEventListener('change', updateCreateResultText);
withUnsubscribe.addEventListener('change', updateCreateResultText);
createSyncButton.addEventListener('click', createSync);
filterStatus();