@include('amocrm2.connector_header')

<div class="content tarif">
    <div class="heading_block">
        <div class="title_block">
            <h2>ТАРИФЫ</h2>
            <div class="fake-blocker"></div>
            <div class="type_payment">
                <a href="javascript:void(0);" id="monthly" class="active">Ежемесячно</a>
                <a href="javascript:void(0);" id="yearly">Ежегодно</a>
            </div>
        </div>
        <div class="amount">
            <select name="" id="amount_selected">
                <option value="KZT">KZT</option>
                <option value="RUR">RUR</option>
                <option value="USD">USD</option>
                <option value="EUR">EUR</option>
            </select>
        </div>
    </div>
    <p class="price-additional-desc"><span class="RedStart">*</span> Продление подписки производится из расчёта 1 месяц
        = 30 дней</p>
    <div class="row mt-4" id="price_content">

    </div>

</div>

<div id="modalPayment" class="modal">
    <div class="modal-content d-flex">
        <div class="payment_content">
            <h3>Выберите тип оплаты</h3>
            <div class="d-flex">
                <div class="payments_type" id="forte">
                    <img src="{{ asset('storage/connector/images/world.svg') }}" alt="">
                    <p>Оплата картой (кроме РФ)</p>
                </div>
                <div class="payments_type" id="robo">
                    <img src="{{ asset('storage/connector/images/russian.svg') }}" alt="">
                    <p>Оплата картой РФ</p>
                </div>
                <div class="payments_type" id="invoice">
                    <img src="{{ asset('storage/connector/images/quote.svg') }}" alt="">
                    <p>Счет на оплату (для Казахстана)</p>
                </div>
            </div>
            <span class="close">×</span>
        </div>
    </div>
</div>

@include('amocrm2.connector_footer')
</div>

<script>
    document.getElementById('monthly').addEventListener('click', function() {
        document.querySelector('.price-additional-desc').innerHTML =
            '<span class="RedStart">*</span> Продление подписки производится из расчёта 1 месяц = 30 дней';
    });

    document.getElementById('yearly').addEventListener('click', function() {
        document.querySelector('.price-additional-desc').innerHTML =
            '<span class="RedStart">*</span> Продление подписки производится из расчёта 1 год = 12 х 30 дней = 360 дней';
    });
</script>


<script>
    // Функция для добавления блоков тарифов в price_content


    function addPricesToPage(prices) {
        var priceContent = document.getElementById('price_content');

        var tariff_name = document.getElementById('tariff');

        var allDataSess = sessionStorage.getItem('allData');
        var parseData = JSON.parse(allDataSess);
        const tariffName = document.getElementById('tariff').innerText.trim();

        const foundPrice = prices.find(price => price.ru_title === tariffName);

        var tariff_id = foundPrice.id
        prices.forEach(function(price) {

            var div = document.createElement('div');
            div.className = 'col-md-3';

            var priceBox = document.createElement('div');
            priceBox.className = 'price_box';
            priceBox.classList.add('box_' + price.id);
            priceBox.setAttribute('data-tariff', price.id);

            // Изменение названий тарифов согласно запросу
            var ruTitle = '';
            if (price.ru_title === 'Профессиональный') {
                ruTitle = 'Про';
            } else if (price.ru_title === 'Старт') {
                ruTitle = 'Базовый';
            } else {
                ruTitle = price.ru_title;
            }

            // Определяем цену для отображения
            var priceText = '';
            if (price.kzt_monthly !== null && price.kzt_monthly !== 0) {
                priceText = price.kzt_monthly + ' ' + price.kzt_symbol + ' / мес' +
                    `<span class="RedStart"> *</span>`;
            } else if (price.kzt_monthly === 0) {
                priceText = 'Бесплатно';
            } else {
                priceText = 'По запросу';
            }

            var priceTextUSD = price.usd_monthly !== null && price.usd_monthly !== 0 ? '~ ' + price
                .usd_monthly + ' USD / мес' + `<span class="RedStart"> *</span>` : '';
            var priceTextEUR = price.eur_monthly !== null && price.eur_monthly !== 0 ? '~ ' + price
                .eur_monthly + ' EUR / мес' + `<span class="RedStart"> *</span>` : '';
            var priceTextRUB = price.rub_monthly !== null && price.rub_monthly !== 0 ? price.rub_monthly +
                ' RUR / мес' + `<span class="RedStart"> *</span>` : '';

            var optionList = createOptionList(price.options);
            console.log(tariff_id)
            if (price.id === 1) {
                var buttonClicker =
                    `<button id="pack_${price.id}" class="clicker" data-id="${price.id}" disabled>По умолчанию</button>`;
            } else if (price.id === tariff_id) {
                var buttonClicker =
                    `<button id="pack_${price.id}" class="clicker" data-id="${price.id}" disabled>Продлить</button>`;
                priceBox.style.boxShadow = '0 0 15px rgba(0, 104, 210, 1)';
            } else {
                var buttonClicker =
                    `<button id="pack_${price.id}" class="clicker" data-id="${price.id}">Подключить</button>`;
            }



            var innerHTML = `
            <div class="text-center">
                <h2 class="pack_title">${ruTitle}</h2>
                <h3 class="pack_price">${priceText}</h3>
                <p class="other_price">${priceTextUSD}<br>${priceTextEUR}<br>${priceTextRUB}</p>
                ${buttonClicker}
            </div>
            <ul class="options_${price.id}">
                ${optionList}
            </ul>
        `;

            priceBox.innerHTML = innerHTML;
            div.appendChild(priceBox);
            priceContent.appendChild(div);
        });
    }

    // Функция для создания списка дополнительных пунктов
    function createOptionList(options) {
        var optionList = '';
        try {
            var parsedOptions = JSON.parse(options);
            for (var key in parsedOptions) {
                if (parsedOptions.hasOwnProperty(key)) {
                    optionList += `<li><p>${parsedOptions[key]}</p></li>`;
                }
            }
        } catch (error) {
            console.error('Ошибка при парсинге JSON данных:', error);
        }
        return optionList;
    }

    fetch('https://toolpack.masnaget.digital/api/v1/connector/amocrm/prices')
        .then(response => {
            if (!response.ok) {
                throw new Error('HTTP error ' + response.status);
            }
            return response.json();
        })
        .then(data => {
            console.log('Полученные данные:', data); // Проверьте данные в консоли
            addPricesToPage(data);
        })
        .catch(error => console.error('Ошибка загрузки тарифов:', error));




    // Функция для получения данных с сервера
    function fetchData(url) {
        fetch(url)
            .then(response => response.json())
            .then(data => {
                updatePrices(data); // Обновляем цены для всех блоков
            })
            .catch(error => console.error('Ошибка:', error));
    }

    function updatePrices(prices) {
        var amountSelected = document.getElementById('amount_selected').value;
        var priceBoxes = document.querySelectorAll('.price_box');

        priceBoxes.forEach(function(priceBox, index) {
            var priceData = prices[index];
            if (priceData && priceData[amountSelected] !== null && priceData[amountSelected] !== 0) {
                var priceElement = priceBox.querySelector('.pack_price');
                var priceText = priceData[amountSelected] !== null ? priceData[amountSelected] + ' ' +
                    priceData[amountSelected + '_symbol'] + ` / мес <span class="RedStart"> *</span>` :
                    'По запросу';
                priceElement.innerHTML = priceText;

                var otherPriceElement = priceBox.querySelector('.other_price');
                var otherPriceText = '';
                if (priceData['USD'] !== null) {
                    otherPriceText += '~ ' + priceData['USD'] + ' USD / мес' +
                        `<span class="RedStart"> *</span><br>`;
                }
                if (priceData['EUR'] !== null) {
                    otherPriceText += '~ ' + priceData['EUR'] + ' EUR / мес' +
                        `<span class="RedStart"> *</span><br>`;
                }
                if (priceData['RUR'] !== null) {
                    otherPriceText += priceData['RUR'] + ' RUR / мес' + `<span class="RedStart"> *</span><br>`;
                }
                otherPriceElement.innerHTML = otherPriceText;
            }
        });
    }


    // Вызываем fetchData при загрузке страницы для получения первоначальных данных
    //fetchData('/api/v1/connector/amocrm/prices');

    // Обработчик смены выбранной валюты
    $('#amount_selected').change(function() {
        var selectedValue = $(this).val();
        fetchData('https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' + selectedValue);
    });

    // Обработчик клика на кнопку смены типа оплаты
    $('.type_payment a').on('click', function() {
        $('.type_payment a').removeClass('active');
        $(this).addClass('active');

        var buttonId = $(this).attr('id');
        fetchData('https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' + buttonId);
    });


    // Обработчик смены выбранной валюты
    $('#amount_selected').change(function() {
        var selectedValue = $(this).val();
        fetchData('https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' + selectedValue);
    });

    // Обработчик клика на кнопку смены типа оплаты
    $('.type_payment a').on('click', function() {
        $('.type_payment a').removeClass('active'); // Удаляем класс active у всех ссылок
        $(this).addClass('active'); // Добавляем класс active только нажатой ссылке

        var buttonId = $(this).attr('id');
        fetchData('https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' + buttonId);
    });
</script>

<style>
    .text-center {
        /* width: 300px; */
        height: 240px;
        margin: 0 auto;

        white-space: nowrap;
        /* чтобы текст не переносился на следующую строку */
        overflow: hidden;
        /* скрытие части текста, которая не помещается */
        text-overflow: ellipsis;
        /* отображение многоточия в конце текста, если он не помещается */
    }

    .other_price {
        height: 65px;
    }



    #pack_1 {
        cursor: default;
    }

    #pack_1:hover {
        background-color: #12806a !important;
        cursor: default;
    }



    /* Уменьшаем размер шрифта для длинных строк */
    @media screen and (max-width: 600px) {
        .pack_price {
            font-size: 12px;
        }
    }
</style>

<script>
    $(document).ready(function() {

        $('#amount_selected').change(function() {
            var selectedValue = $(this).val();
            // console.log(selectedValue); // Пример вывода в консоль
            var activeLink = $('.type_payment').find('a.active');
            var activeId = activeLink.attr('id');
            var url = 'https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' + activeId;
            fetchData(url); // Вызываем функцию fetchData() с нужным URL
        });

        $('.type_payment a').on('click', function() {
            $('.type_payment a').removeClass('active'); // Удаляем класс active у всех ссылок
            $(this).addClass('active'); // Добавляем класс active только нажатой ссылке

            var buttonId = $(this).attr('id');
            var url = 'https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' + buttonId;
            console.log(buttonId)
            if (buttonId === 'monthly') {
                $("#payment_day_info").html(
                    "<p><span style='color:red;margin-bottom: 10px'>*</span> Продление подписки производится из расчёта 1 месяц = 30 дней</p>"
                )
                $(".discount").css('display', 'none');
            } else if (buttonId === 'yearly') {
                $("#payment_day_info").html(
                    "<p><span style='color:red;margin-bottom: 10px'>*</span> Продление подписки производится из расчёта 1 год = 12 х 30 дней = 360 дней</p>"
                )
                var discount =
                    '<div class="discount"><p>-20%</p></div>'; // Создаем HTML-код для элемента с классом "discount"
                $(".price_box").append(discount);
            }
            fetchData(url); // Вызываем функцию fetchData() с нужным URL
        });

        $(document).on('click', '#invoice', function() {

            var phone = '77071651513'; // укажите номер в международном формате без +
            var message = encodeURIComponent('Здравствуйте! Хочу получить счет на оплату | MDS Data connector');
            var whatsappUrl = 'https://wa.me/' + phone + '?text=' + message;
            window.open(whatsappUrl, '_blank');
            return; // прекращаем дальнейшее выполнение

        });



        $(document).on('click', '.clicker', function() {
            var type_payment = $('.type_payment a.active').attr('id');
            var tariff_id = $(this).attr('data-id');

            if (tariff_id === '4' || tariff_id === 4) {
                var phone = '77071651513'; // укажите номер в международном формате без +
                var message = encodeURIComponent('Здравствуйте! Хочу подключить тариф Enterprise | MDS Data connector');
                var whatsappUrl = 'https://wa.me/' + phone + '?text=' + message;
                window.open(whatsappUrl, '_blank');
                return; // прекращаем дальнейшее выполнение
            }

            $('#modalPayment').show();
            $("#forte").attr('data-type', type_payment).attr('data-id', tariff_id);
            $("#robo").attr('data-type', type_payment).attr('data-id', tariff_id);
        });

        $(document).on('click', '.close', function() {
            // Скрываем модальное окно
            $("#myModal").fadeOut();
            $("#modalAlertTwo").fadeOut();
            $("#modalPayment").fadeOut();
            $("body").css('overflow', 'auto')
        });



    });








    $(document).ready(function() {

        $("#forte").on('click', function() {
            var domain = localStorage.getItem('domain');
            var type_payment = $(this).attr('data-type')
            //console.log(type_payment)
            var token = $("#domain_token").val()
            var tarrif_id = parseInt($(this).attr('data-id'));

            //console.log(token)
            var url = 'https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' +
                type_payment;
            $.ajax({
                url: url, // Указываем URL для запроса
                type: 'GET', // Указываем метод POST
                contentType: 'application/json', // Указываем тип контента
                success: function(response) {
                    var orderData = [];
                    // Обработка успешного ответа от сервера
                    response.forEach(function(item) {
                        // var tariff = $(this).attr('data-id')
                        console.log(item.id, tarrif_id)
                        if (type_payment === 'monthly' && item.id === tarrif_id) {
                            orderData = {
                                "order": {
                                    "typeRid": "Order_RID",
                                    "language": "ru",
                                    "amount": item.KZT,
                                    "currency": 'KZT',
                                    "hppRedirectUrl": "https://masnaget.digital",
                                    "description": 'Подписка "' +
                                        item.title +
                                        '" на Bitrix24 Data Connector для ' +
                                        domain +
                                        ' (1 мес.)'
                                },
                                "connector": {
                                    "tariff_id": tarrif_id,
                                    "payed_months": 1,
                                    "payment_type": 'forte_connector'
                                }
                            }


                        } else if (type_payment === 'yearly' && item.id ===
                            tarrif_id) {
                            orderData = {
                                "order": {
                                    "typeRid": "Order_RID",
                                    "language": "ru",
                                    "amount": item.KZT * 12,
                                    "currency": 'KZT',
                                    "hppRedirectUrl": "https://masnaget.digital",
                                    "description": 'Подписка "' +
                                        item.title +
                                        '" на Bitrix24 Data Connector для ' +
                                        domain +
                                        ' (12 мес.)'
                                },
                                "connector": {
                                    "tariff_id": tarrif_id,
                                    "payed_months": 12,
                                    "payment_type": 'forte_connector'
                                }
                            }
                        }
                    });
                    // console.log(orderData)
                    var url =
                        'https://toolpack.masnaget.digital/api/v1/create/' +
                        token + '/payment_order';
                    var requestData = JSON.stringify(orderData);

                    console.log(requestData)

                    $.ajax({
                        url: url, // Указываем URL для запроса
                        type: 'POST', // Указываем метод POST
                        data: requestData, // Преобразуем объект requestData в JSON строку
                        contentType: 'application/json', // Указываем тип контента
                        success: function(response) {
                            // console.log(response)
                            // Обработка успешного ответа от сервера
                            window.open(response);
                        },
                        error: function(xhr, status,
                            error) {
                            // Обработка ошибок
                            console.error(
                                'Ошибка AJAX запроса:',
                                error);
                        }
                    });

                },
                error: function(xhr, status, error) {
                    // Обработка ошибок
                    console.error('Ошибка AJAX запроса:', error);
                }
            });
        });

        $("#robo").on('click', function() {
            var domain = localStorage.getItem('domain');;
            var type_payment = $(this).attr('data-type')
            var token = $("#domain_token").val()
            var tarrif_id = parseInt($(this).attr('data-id'));
            var url = 'https://toolpack.masnaget.digital/api/v1/connector/bitrix24/price/' +
                type_payment;
            $.ajax({
                url: url, // Указываем URL для запроса
                type: 'GET', // Указываем метод POST
                contentType: 'application/json', // Указываем тип контента
                success: function(response) {
                    var orderData = [];
                    // Обработка успешного ответа от сервера
                    response.forEach(function(item) {

                        console.log(item.id, tarrif_id)
                        if (type_payment === 'monthly' && item.id === tarrif_id) {
                            orderData = {
                                "order": {
                                    "language": "ru",
                                    "amount": item.RUR,
                                    "currency": 'rub',
                                    "description": 'Программа для ЭВМ «MDS Data Connector», лицензия «' +
                                        item.title + '» (30 дней)'
                                },
                                "connector": {
                                    "tariff_id": tarrif_id,
                                    "payed_months": 1,
                                    "payment_type": 'robokassa',
                                    "title": 'Программа для ЭВМ «MDS Data Connector», лицензия «' +
                                        item.title + '» (30 дней)'
                                }
                            }
                        } else if (type_payment === 'yearly' && item.id ===
                            tarrif_id) {
                            orderData = {
                                "order": {
                                    "language": "ru",
                                    "amount": item.RUR * 12,
                                    "currency": 'rub',
                                    "description": 'Программа для ЭВМ «MDS Data Connector», лицензия «' +
                                        item.title + '» (360 дней)'
                                },
                                "connector": {
                                    "tariff_id": tarrif_id,
                                    "payed_months": 12,
                                    "payment_type": 'robokassa',
                                    "title": 'Программа для ЭВМ «MDS Data Connector», лицензия «' +
                                        item.title + '» (360 дней)'
                                }
                            }
                        }
                    });
                    // console.log(orderData)
                    var url =
                        'https://toolpack.masnaget.digital/api/v3/create/' +
                        token + '/payment_order';
                    var requestData = JSON.stringify(orderData);
                    $.ajax({
                        url: url, // Указываем URL для запроса
                        type: 'POST', // Указываем метод POST
                        data: requestData, // Преобразуем объект requestData в JSON строку
                        contentType: 'application/json', // Указываем тип контента
                        success: function(response) {
                            // Обработка успешного ответа от сервера
                            window.open(response);
                        },
                        error: function(xhr, status,
                            error) {
                            // Обработка ошибок
                            console.error(
                                'Ошибка AJAX запроса:',
                                error);
                        }
                    });

                },
                error: function(xhr, status, error) {
                    // Обработка ошибок
                    console.error('Ошибка AJAX запроса:', error);
                }
            });
        });
    })
</script>


<script>
    var tariff = localStorage.getItem('tariff');
    var expire_date = localStorage.getItem('expire_date');

    if (tariff !== undefined && expire_date !== undefined) {
        // Если данные корректны, устанавливаем их значения для элементов
        $("#expire_date").text(expire_date);
        $("#tariff").text(tariff);
    }
</script>