<?php
require __DIR__ . '/../../_layout.php';
?>

<div class="container">
    <h1>Configurações de Pagamento</h1>

    <div class="card" style="margin-top: 2rem;">
        <h2>Mercado Pago</h2>
        <form id="mercadopago-form" style="margin-top: 1rem;">
            <div style="margin-bottom: 1rem;">
                <label>
                    <input type="checkbox" id="mp_enabled" name="enabled">
                    Habilitar Mercado Pago
                </label>
            </div>

            <div style="margin-bottom: 1rem;">
                <label>Public Key</label>
                <input type="text" id="mp_public_key" name="public_key" placeholder="APP_USR-...">
            </div>

            <div style="margin-bottom: 1rem;">
                <label>Access Token</label>
                <input type="password" id="mp_access_token" name="access_token" placeholder="Seu access token">
                <small>Token de acesso do Mercado Pago (será criptografado)</small>
            </div>

            <button type="submit" class="btn">Salvar Configurações</button>
        </form>
    </div>

    <div class="card" style="margin-top: 2rem;">
        <h2>PagBank</h2>
        <form id="pagbank-form" style="margin-top: 1rem;">
            <div style="margin-bottom: 1rem;">
                <label>
                    <input type="checkbox" id="pb_enabled" name="enabled">
                    Habilitar PagBank
                </label>
            </div>

            <div style="margin-bottom: 1rem;">
                <label>Client ID</label>
                <input type="text" id="pb_client_id" name="public_key" placeholder="Seu Client ID">
            </div>

            <div style="margin-bottom: 1rem;">
                <label>Client Secret</label>
                <input type="password" id="pb_client_secret" name="secret_key" placeholder="Seu Client Secret">
                <small>Client Secret do PagBank (será criptografado)</small>
            </div>

            <button type="submit" class="btn">Salvar Configurações</button>
        </form>
    </div>

    <div class="card" style="margin-top: 2rem; background: #fef3c7; border-left: 4px solid #f59e0b;">
        <h3>⚠️ Importante</h3>
        <p>Os pagamentos são processados diretamente do consumidor final para o lojista. As credenciais configuradas aqui são da conta do lojista, não da plataforma ERP.</p>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', async () => {
    await loadPagamentos();
    
    document.getElementById('mercadopago-form').addEventListener('submit', async (e) => {
        e.preventDefault();
        await savePagamento('mercadopago', {
            enabled: document.getElementById('mp_enabled').checked,
            public_key: document.getElementById('mp_public_key').value,
            access_token: document.getElementById('mp_access_token').value
        });
    });
    
    document.getElementById('pagbank-form').addEventListener('submit', async (e) => {
        e.preventDefault();
        await savePagamento('pagbank', {
            enabled: document.getElementById('pb_enabled').checked,
            public_key: document.getElementById('pb_client_id').value,
            secret_key: document.getElementById('pb_client_secret').value
        });
    });
});

async function loadPagamentos() {
    const token = localStorage.getItem('auth_token') || getCookie('auth_token');
    const tenantId = getCookie('tenant_id') || 'default';
    
    try {
        const res = await fetch('/api/ecommerce/pagamentos', {
            headers: {
                'Authorization': `Bearer ${token}`,
                'X-Tenant-Id': tenantId
            }
        });
        
        if (res.ok) {
            const { data } = await res.json();
            
            if (data.mercadopago) {
                document.getElementById('mp_enabled').checked = data.mercadopago.enabled || false;
                document.getElementById('mp_public_key').value = data.mercadopago.public_key || '';
            }
            
            if (data.pagbank) {
                document.getElementById('pb_enabled').checked = data.pagbank.enabled || false;
                document.getElementById('pb_client_id').value = data.pagbank.public_key || '';
            }
        }
    } catch (error) {
        console.error('Erro ao carregar pagamentos:', error);
    }
}

async function savePagamento(provider, data) {
    const token = localStorage.getItem('auth_token') || getCookie('auth_token');
    const tenantId = getCookie('tenant_id') || 'default';
    
    const endpoint = provider === 'mercadopago' ? '/api/ecommerce/pagamentos/mercadopago' : '/api/ecommerce/pagamentos/pagbank';
    
    try {
        const res = await fetch(endpoint, {
            method: 'PUT',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${token}`,
                'X-Tenant-Id': tenantId
            },
            body: JSON.stringify(data)
        });
        
        if (res.ok) {
            alert('Configurações de pagamento salvas com sucesso!');
        } else {
            const error = await res.json();
            alert('Erro: ' + (error.error?.message || 'Erro ao salvar'));
        }
    } catch (error) {
        console.error('Erro:', error);
        alert('Erro ao salvar configurações');
    }
}

function getCookie(name) {
    const value = `; ${document.cookie}`;
    const parts = value.split(`; ${name}=`);
    if (parts.length === 2) return parts.pop().split(';').shift();
}
</script>

