Pagamento PIX/title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> <style> .qr-container { background-color: #f8f9fa; border: 2px dashed #dee2e6; border-radius: 10px; padding: 20px; display: inline-block; } </style> </head> <body class="bg-light"> <div class="container mt-5 mb-5"> <div class="card shadow p-4 mx-auto" style="max-width: 500px;"> <div class="text-center mb-4"> <h3>ATENÇÃO esta é uma versão de Teste<br>com PIX REAL de R$ 1,99<br>Finalizar Transferencia com QR Code ou codigo.</h3> <span class="badge bg-success fs-5">Total: R$ 1.99</span> <div class="text-muted small mt-2">Pagamento para: vigilantesdaleiadm@gmail.com</div> </div> <form method="POST"> <div class="row"> <div class="col-md-6 mb-3"> <label class="form-label">Nome do Pagador</label> <input type="text" name="nome" class="form-control" placeholder="Seu nome" required> </div> <div class="col-md-6 mb-3"> <label class="form-label">Matrícula</label> <input type="text" name="matricula" class="form-control" placeholder="Sua matrícula" required> </div> </div> <div class="mb-3"> <label class="form-label">Mês de Pagamento</label> <select name="identificador" class="form-control" id="mesPagamento" required> <option value="">Selecione o mês</option> </select> </div> <button type="submit" class="btn btn-primary w-100 py-2 mb-3">Gerar QR Code Pix</button> </form> </div> </div> <script> // Função para gerar opções de meses no formato MMMAA function popularMesesPagamento() { const select = document.getElementById('mesPagamento'); const meses = ['JAN', 'FEV', 'MAR', 'ABR', 'MAI', 'JUN', 'JUL', 'AGO', 'SET', 'OUT', 'NOV', 'DEZ']; const dataAtual = new Date(); const mesAtual = dataAtual.getMonth(); // 0-11 const anoAtual = dataAtual.getFullYear(); // Gerar meses de 2025 em ordem crescente (JAN25 até DEZ25) e depois 2026 let opcoes = []; // Adicionar meses de 2025 em ordem crescente (JAN25 até DEZ25) for (let mes = 0; mes <= 11; mes++) { const texto = meses[mes] + '25'; opcoes.push({ mes: mes, ano: 2025, texto: texto }); } // Adicionar meses de 2026 em ordem crescente (JAN26 até DEZ26) // JAN26 aparece logo após DEZ25 for (let mes = 0; mes <= 11; mes++) { const texto = meses[mes] + '26'; opcoes.push({ mes: mes, ano: 2026, texto: texto }); } // Adicionar opções ao select opcoes.forEach(opcao => { const option = document.createElement('option'); option.value = opcao.texto; option.textContent = opcao.texto; select.appendChild(option); }); // Definir o mês atual como selecionado const mesAtualTexto = meses[mesAtual] + (anoAtual % 100).toString().padStart(2, '0'); const opcaoAtual = Array.from(select.options).find(opt => opt.value === mesAtualTexto); if (opcaoAtual) { select.value = mesAtualTexto; } else { // Se o mês atual não estiver na lista, selecionar a primeira opção disponível if (select.options.length > 1) { select.selectedIndex = 1; } } } // Executar quando a página carregar document.addEventListener('DOMContentLoaded', popularMesesPagamento); </script> </body> </html>