# Diagnóstico Técnico - Melhorias no Checkout PIX
**Data:** 2025  
**Sistema:** Checkout Pro 2025  
**Objetivo:** Planejar melhorias na UI do PIX e implementar verificação automática de pagamento

---

## 📋 RESUMO EXECUTIVO

O arquivo `backend/pix.php` já possui uma estrutura HTML básica funcional, mas precisa de melhorias em UX e implementação de polling automático para verificar o status do pagamento. A análise indica que é **viável** implementar as melhorias solicitadas.

---

## 1. 🔍 ANÁLISE DO ARQUIVO `backend/pix.php`

### Estado Atual

**✅ Estrutura HTML Completa:**
- Possui `<!DOCTYPE html>`, `<head>`, `<body>`
- Já exibe QR Code (via base64)
- Já possui botão "Copiar Código" funcional
- Já possui botão "Mostrar/Esconder QR Code"
- Interface visual básica com estilos CSS

**❌ Problemas Identificados:**

1. **QR Code:** Está oculto por padrão (usuário precisa clicar para ver)
   - Linha 93: `.qr-code-container { display: none; }`
   - **Recomendação:** Exibir QR Code por padrão (melhor UX)

2. **Falta de Cronômetro:** Não há contador regressivo visual
   - **Recomendação:** Adicionar timer regressivo (ex: 30 minutos)

3. **Falta de Polling:** Não há verificação automática de status
   - **Recomendação:** Implementar polling a cada 5 segundos

### Parâmetros Recebidos (URL atual):

```php
// Linha 3-8 de pix.php
$qr_code_base64 = $_GET['qr_code_base64'];
$qr_code = $_GET['qr_code'];
$valor_total = $_GET['valor_total'];
$produto_id = $_GET['produto_id'];
```

**⚠️ PROBLEMA CRÍTICO IDENTIFICADO:**

A URL atual **NÃO inclui** o `transacao_id` ou `payment_id`, o que impede fazer polling para verificar o status do pagamento.

**URL Atual:**
```
backend/pix.php?produto_id=X&valor_total=Y&qr_code_base64=...&qr_code=...
```

**URL Necessária:**
```
backend/pix.php?produto_id=X&valor_total=Y&qr_code_base64=...&qr_code=...&transacao_id=Z
```

---

## 2. 🔗 ANÁLISE DO FLUXO DE CRIAÇÃO DA TRANSAÇÃO

### Arquivo: `backend/process_payment_pix.php`

**Linha 118-139:** Cria a transação no banco:
```php
$stmt = $pdo->prepare("INSERT INTO transacoes (...) VALUES (...)");
$stmt->execute([...]);
// ⚠️ NÃO captura $pdo->lastInsertId() após o INSERT
```

**Linha 220-239:** Após criar pagamento no Mercado Pago, atualiza a transação:
```php
$stmt = $pdo->prepare("UPDATE transacoes SET qr_code = :qr_code, qr_code_base64 = :qr_code_base64, payment_id = :payment_id, status = 'Pendente' WHERE id = :id");
$stmt->execute([
    ':id' => $transaction_id  // ⚠️ Variável $transaction_id não é definida no código atual
]);
```

**✅ DESCOBERTA:**

O código atual **JÁ CAPTURA** `$transaction_id` na linha 168:
```php
$transaction_id = $pdo->lastInsertId();
```

**⚠️ AÇÃO NECESSÁRIA:**

1. ✅ `$transaction_id` já está sendo capturado
2. ❌ **FALTA:** Incluir `transaction_id` no JSON de resposta (linha 235)
3. ❌ **FALTA:** Modificar `views/js/checkout.js` (linha 933) para incluir `transacao_id` na URL do redirect

---

## 3. 📊 ANÁLISE DA TABELA `transacoes`

### Estrutura Relevante:

```sql
CREATE TABLE `transacoes` (
  `id` INT(11) NOT NULL AUTO_INCREMENT,              -- ID da transação (PRIMARY KEY)
  `payment_id` VARCHAR(255) DEFAULT NULL,            -- ID do pagamento no Mercado Pago
  `external_reference` VARCHAR(255) DEFAULT NULL,    -- Referência externa única
  `status` VARCHAR(50) NOT NULL,                     -- Status: 'Pendente', 'Aprovado', 'Rejeitado', etc.
  `link_entregavel` VARCHAR(500) DEFAULT NULL,       -- Link do produto digital
  ...
  KEY `idx_payment_id` (`payment_id`),
  KEY `idx_status` (`status`)
)
```

### Status Possíveis:

- `'Pendente'` - Pagamento aguardando confirmação
- `'Aprovado'` - Pagamento confirmado (quando webhook atualiza)
- `'Rejeitado'` - Pagamento rejeitado
- `'Reembolsado'` - Pagamento reembolsado

### Verificação de Status:

O webhook (`backend/webhook.php`, linha 54) atualiza o status quando o pagamento é aprovado:
```php
UPDATE transacoes SET status = 'Aprovado', notificado = 1 WHERE payment_id = :payment_id
```

**✅ CONCLUSÃO:** 
- A coluna `status` é a chave para verificação
- Podemos usar `transacao_id` (campo `id`) OU `payment_id` para consultar o status

---

## 4. 🔄 PLANO PARA API DE VERIFICAÇÃO DE STATUS

### Arquivo Proposto: `backend/api/check_status.php`

**Função:** Endpoint leve que retorna o status da transação

**Parâmetros de Entrada:**
- `transacao_id` (INT) - ID da transação no banco
- OU `payment_id` (VARCHAR) - ID do pagamento no Mercado Pago

**Resposta JSON:**
```json
{
  "status": "Aprovado",
  "link_entregavel": "https://...",
  "produto_id": 123
}
```

**Query SQL:**
```sql
SELECT status, link_entregavel, produto_id 
FROM transacoes 
WHERE id = :transacao_id 
LIMIT 1
```

**Segurança:**
- Não retornar dados sensíveis (email, CPF, etc.)
- Validar que a transação existe
- Retornar 404 se não encontrar

---

## 5. 📄 ANÁLISE DA PÁGINA DE OBRIGADO

### Estado Atual:

**❌ Arquivo `obrigado.php` NÃO EXISTE**

**✅ Arquivo Similar Existente:**
- `views/reprovado.php` - Existe e pode ser usado como referência de estrutura

### Estrutura Proposta para `obrigado.php`:

**Localização:** `views/obrigado.php` (seguindo padrão do sistema)

**Parâmetros de Entrada:**
- `produto_id` (INT) - ID do produto comprado
- OU `transacao_id` (INT) - ID da transação (mais seguro)

**Query SQL:**
```sql
SELECT p.link_entregavel, p.nome 
FROM produtos p
INNER JOIN transacoes t ON t.produto_id = p.id
WHERE t.id = :transacao_id AND t.status = 'Aprovado'
LIMIT 1
```

**Exibição:**
- Mensagem de agradecimento
- Botão/link para acessar o produto digital (`link_entregavel`)
- Informações sobre o produto comprado

**Segurança:**
- Validar que a transação existe
- Validar que o status é 'Aprovado'
- Não exibir dados sensíveis

---

## 6. 🎯 PLANO DE AÇÃO DETALHADO

### **ETAPA 1: Preparar Dados da Transação**

**Arquivo:** `backend/process_payment_pix.php`

**Ação:**
1. ✅ `$transaction_id` já está sendo capturado na linha 168 (não precisa alterar)

2. Incluir `transaction_id` no JSON de resposta (linha 235):
   ```php
   echo json_encode([
       'status' => 'success',
       'qr_code_base64' => $qr_code_base64,
       'qr_code' => $qr_code,
       'transaction_id' => $transaction_id  // ✅ ADICIONAR
   ]);
   ```

3. Corrigir o UPDATE na linha 226 para usar a variável correta:
   ```php
   $stmt = $pdo->prepare("UPDATE transacoes SET ... WHERE id = :id");
   $stmt->execute([
       ':id' => $transaction_id,  // ✅ Usar variável capturada
       ...
   ]);
   ```

---

### **ETAPA 2: Atualizar Redirect do Checkout**

**Arquivo:** `views/js/checkout.js` (linha 933)

**Ação:**
Modificar o redirect para incluir `transaction_id`:

```javascript
// ANTES
window.location.href = `/backend/pix.php?produto_id=${produtoId}&valor_total=${valorFinal}&qr_code_base64=${encodeURIComponent(qrCodeBase64)}&qr_code=${encodeURIComponent(qrCode)}`;

// DEPOIS
window.location.href = `/backend/pix.php?produto_id=${produtoId}&valor_total=${valorFinal}&qr_code_base64=${encodeURIComponent(qrCodeBase64)}&qr_code=${encodeURIComponent(qrCode)}&transacao_id=${result.transaction_id}`;
```

**Nota:** Presumindo que `result.transaction_id` estará disponível na resposta do `process_payment_pix.php`.

---

### **ETAPA 3: Criar API de Verificação de Status**

**Arquivo Novo:** `backend/api/check_status.php`

**Estrutura:**
```php
<?php
require_once __DIR__ . '/../config/config_db.php';

header('Content-Type: application/json');

$transacao_id = isset($_GET['transacao_id']) ? intval($_GET['transacao_id']) : 0;

if ($transacao_id <= 0) {
    http_response_code(400);
    echo json_encode(['error' => 'ID de transação inválido']);
    exit;
}

try {
    $stmt = $pdo->prepare("SELECT status, link_entregavel, produto_id FROM transacoes WHERE id = :id LIMIT 1");
    $stmt->execute([':id' => $transacao_id]);
    $transacao = $stmt->fetch(PDO::FETCH_ASSOC);
    
    if (!$transacao) {
        http_response_code(404);
        echo json_encode(['error' => 'Transação não encontrada']);
        exit;
    }
    
    echo json_encode([
        'status' => $transacao['status'],
        'link_entregavel' => $transacao['link_entregavel'],
        'produto_id' => $transacao['produto_id']
    ]);
} catch (PDOException $e) {
    error_log("Erro ao verificar status: " . $e->getMessage());
    http_response_code(500);
    echo json_encode(['error' => 'Erro interno']);
}
```

---

### **ETAPA 4: Melhorar UI do `pix.php`**

**Arquivo:** `backend/pix.php`

**Ações:**

1. **Exibir QR Code por padrão:**
   ```css
   .qr-code-container {
     display: block; /* ✅ Mudar de 'none' para 'block' */
     margin-top: 20px;
   }
   ```

2. **Adicionar cronômetro regressivo:**
   ```javascript
   let timer = 30 * 60; // 30 minutos em segundos
   const timerElement = document.getElementById('timer');
   
   setInterval(() => {
       const minutes = Math.floor(timer / 60);
       const seconds = timer % 60;
       timerElement.textContent = `${minutes}:${seconds.toString().padStart(2, '0')}`;
       if (timer > 0) timer--;
   }, 1000);
   ```

3. **Adicionar polling automático:**
   ```javascript
   const transacaoId = <?= json_encode($_GET['transacao_id'] ?? 0); ?>;
   
   if (transacaoId > 0) {
       const checkStatus = setInterval(async () => {
           try {
               const response = await fetch(`/backend/api/check_status.php?transacao_id=${transacaoId}`);
               const data = await response.json();
               
               if (data.status === 'Aprovado') {
                   clearInterval(checkStatus);
                   window.location.href = `/views/obrigado.php?transacao_id=${transacaoId}`;
               }
           } catch (error) {
               console.error('Erro ao verificar status:', error);
           }
       }, 5000); // A cada 5 segundos
   }
   ```

4. **Melhorar layout visual:**
   - Centralizar QR Code
   - Adicionar instruções mais claras
   - Melhorar espaçamento e tipografia

---

### **ETAPA 5: Criar Página de Obrigado**

**Arquivo Novo:** `views/obrigado.php`

**Estrutura Base:**
```php
<?php
require_once __DIR__ . '/../config/config_db.php';

$transacao_id = isset($_GET['transacao_id']) ? intval($_GET['transacao_id']) : 0;

if ($transacao_id <= 0) {
    header('Location: /');
    exit;
}

try {
    $stmt = $pdo->prepare("
        SELECT p.nome AS produto_nome, p.link_entregavel, t.status 
        FROM transacoes t
        INNER JOIN produtos p ON p.id = t.produto_id
        WHERE t.id = :id AND t.status = 'Aprovado'
        LIMIT 1
    ");
    $stmt->execute([':id' => $transacao_id]);
    $dados = $stmt->fetch(PDO::FETCH_ASSOC);
    
    if (!$dados) {
        // Transação não encontrada ou não aprovada
        header('Location: /');
        exit;
    }
} catch (PDOException $e) {
    error_log("Erro ao buscar dados: " . $e->getMessage());
    header('Location: /');
    exit;
}
?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Pagamento Aprovado!</title>
    <!-- Estilos -->
</head>
<body>
    <div class="container">
        <h1>✅ Pagamento Aprovado!</h1>
        <p>Obrigado pela sua compra!</p>
        
        <div class="produto-info">
            <h2><?= htmlspecialchars($dados['produto_nome']); ?></h2>
            <?php if (!empty($dados['link_entregavel'])): ?>
                <a href="<?= htmlspecialchars($dados['link_entregavel']); ?>" 
                   class="btn-access" 
                   target="_blank">
                    Acessar Produto Digital
                </a>
            <?php endif; ?>
        </div>
    </div>
</body>
</html>
```

---

## 7. ✅ RESUMO DAS ALTERAÇÕES NECESSÁRIAS

### **Arquivos a Modificar:**

1. ✅ `backend/process_payment_pix.php`
   - Capturar `$transaction_id` após INSERT
   - Incluir `transaction_id` no JSON de resposta
   - Corrigir uso da variável no UPDATE

2. ✅ `views/js/checkout.js` (linha 933)
   - Adicionar `transacao_id` na URL do redirect

3. ✅ `backend/pix.php`
   - Receber `transacao_id` via GET
   - Exibir QR Code por padrão
   - Adicionar cronômetro regressivo
   - Implementar polling a cada 5 segundos
   - Melhorar UI visual

### **Arquivos a Criar:**

4. ✅ `backend/api/check_status.php`
   - Endpoint para verificar status da transação

5. ✅ `views/obrigado.php`
   - Página de agradecimento com link para produto

---

## 8. 🚨 PONTOS DE ATENÇÃO

### **Segurança:**
- Validar sempre `transacao_id` (tipo INT, > 0)
- Não expor dados sensíveis na API
- Validar status antes de redirecionar para obrigado

### **Performance:**
- Polling a cada 5 segundos é razoável (não sobrecarrega servidor)
- Considerar aumentar intervalo após 5 minutos (ex: 10 segundos)
- Limitar tempo total de polling (ex: 30 minutos máximo)

### **UX:**
- Mostrar feedback visual durante polling ("Verificando pagamento...")
- Exibir mensagem clara quando pagamento for aprovado
- Permitir que usuário feche a página sem perder acesso ao produto (email já é enviado)

### **Compatibilidade:**
- QR Code base64 já está funcionando (não precisa alterar)
- Função de copiar código já funciona (não precisa alterar)
- Google Analytics já está integrado (manter)

---

## 9. 📊 CONCLUSÃO

**✅ VIABILIDADE:** **APROVADA**

Todas as melhorias são viáveis e não quebram funcionalidades existentes. O código atual já possui boa base para expansão.

**Ordem de Implementação Recomendada:**
1. Criar API `check_status.php` (mais simples, testável isoladamente)
2. Modificar `process_payment_pix.php` para passar `transaction_id`
3. Atualizar `checkout.js` para incluir `transaction_id` na URL
4. Adicionar polling no `pix.php`
5. Melhorar UI do `pix.php`
6. Criar `obrigado.php`

**Tempo Estimado:** 2-3 horas de desenvolvimento + testes

---

**Relatório gerado por:** Sistema de Análise Técnica  
**Data:** 2025

