import { Controller } from 'stimulus';
const loader = require("./../components/loader.js");
const helper = require("./../components/helper.js");

/*
 * This is an example Stimulus controller!
 *
 * Any element with a data-controller="payment" attribute will cause
 * this controller to be executed. The name "payment" comes from the filename:
 * payment_controller.js -> "payment"
 *
 * Delete this file or adapt it for your use!
 */
export default class extends Controller {
    connect() {
        loader.loadSDK('payment').then(function(webSDK) {
            webSDK.on('init', function() {
                if (this.data.user.authenticated) {
                    runWebSDK();           
                } else {
                    window.location.pathname = '/logout'
                }
            });
        })

        let runWebSDK = function () {
            this.finance();
        }.bind(this)
    }

    finance() {
        var securityPayment = document.getElementById('security-payment');

        webSDK.loadPaymentList({
            start: 0,
            length: 50 
        }).then(function (resolve) {
            var paymentWrap = securityPayment.querySelector('.payment-wrap');

            if (resolve.length > 0) {
                resolve.forEach(function(item, index) {
                    var paymentShow = securityPayment.querySelector('.payment-item').cloneNode(true);
                    
                    paymentShow.querySelector('.pay-id').innerHTML = item.id;
                    paymentShow.querySelector('.address').innerHTML = item.filialName;
                    paymentShow.querySelector('.comment').innerHTML = item.comment;
                    paymentShow.querySelector('.specialist').innerHTML = item.doctor;
                    paymentShow.querySelector('.service').innerHTML = item.service;

                    var date = window.newDate(item.date);
                    paymentShow.querySelector('.month').innerHTML = getWeekDay(date);
                    paymentShow.querySelector('.date').innerHTML = window.dateFormat(date, 'd-m-Y')
                    paymentShow.querySelector('.pay-date').innerHTML = window.dateFormat(date, 'd-m-Y')
                    
                    paymentShow.querySelectorAll('.amt').forEach(function (el) {
                        el.innerHTML = item.amt;

                        if (item.status.id == 0) {
                            paymentShow.querySelector('.pay').querySelector('.button-revers').classList.remove('d-none');
                        } else {
                            paymentShow.querySelector('.pay').querySelector('.button-revers').classList.add('d-none');
                            paymentShow.querySelector('.pay').querySelector('.price').classList.remove('d-none');
                        }
                    });
                    
                    paymentShow.querySelector('.pay').querySelector('.button-revers').dataset.orderId = item.id;
                    paymentShow.querySelector('.pay').querySelector('.button-revers').dataset.filial = item.filial;
                    paymentShow.querySelector('.pay').querySelector('.button-revers').dataset.amt = item.amt;
                    paymentShow.querySelector('.pay').querySelector('.button-revers').dataset.payprofileid = item.magazineId;

                    paymentShow.querySelector('.pay').querySelector('.button-revers').addEventListener('click', function (evn) {
                        var popup = document.getElementById('popup');
                        var params = {
                            'orderid': Number(this.dataset.orderId) ,
                            'payprofileid': this.dataset.payprofileid,
                            'payamount': this.dataset.amt,
                            // 'paymethod': 'QW',
                            'filial': Number(this.dataset.filial),
                            'pcode': webSDK.data.user.representId,
                            'successurl': document.location.origin + '/payment?pay=true',
                            'errorurl': document.location.origin + '/payment?pay=false',
                            'containerId': 'popup-body', 
                        };
                        
                        webSDK.loadPaymentView(params);
                        popup.querySelector('.modal-body').innerHTML = '';
                        popup.querySelector('.modal-title').innerHTML = 'Оплата';

                        $(popup).modal('show');
                    })

                    paymentShow.classList.add('mt-3')
                    paymentShow.classList.remove('d-none')

                    if (index == 0) {
                        paymentWrap.innerHTML = "";
                    } 

                    paymentWrap.appendChild(paymentShow);
                })
            }
        }).catch(function (e) {
            helper.sendRequest({
                    data: {'error': e, method: 'loadPaymentList'}
                }, helper.getHostname() + '/api/log', "POST", "json", true, "application/json");
        })
    }
}