Spaces:
Running
Running
adicione um sistema de cenários para separar os testes em cenários, como uma branch
7520416
verified
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Mobile Test Pilot - Plataforma de Testes</title> | |
| <link rel="stylesheet" href="style.css"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: '#21223a', | |
| secondary: '#ff580f', | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body class="bg-primary min-h-screen text-white"> | |
| <custom-sidebar></custom-sidebar> | |
| <main class="ml-64 p-8"> | |
| <div class="max-w-6xl mx-auto"> | |
| <div class="bg-primary rounded-2xl border border-gray-700 p-8 shadow-2xl"> | |
| <div class="text-center mb-12"> | |
| <h1 class="text-4xl font-bold mb-4">Mobile Test Pilot</h1> | |
| <p class="text-gray-300 text-lg">Teste seus aplicativos Android e iOS de forma intuitiva com IA</p> | |
| </div> | |
| <div class="grid md:grid-cols-2 gap-8 items-center"> | |
| <div> | |
| <h2 class="text-2xl font-semibold mb-4">Inicie um novo teste</h2> | |
| <p class="text-gray-300 mb-6"> | |
| Selecione um emulador Android ou iOS, envie seu aplicativo e comece a testar | |
| usando linguagem natural através do nosso chatbot inteligente. | |
| </p> | |
| <button onclick="openTestModal()" class="bg-secondary hover:bg-orange-600 text-white font-bold py-3 px-8 rounded-full transition-all duration-300 transform hover:scale-105 flex items-center gap-2"> | |
| <i data-feather="play" class="w-5 h-5"></i> | |
| Iniciar Novo Teste | |
| </button> | |
| </div> | |
| <div class="hidden md:block"> | |
| <div class="relative bg-gradient-to-br from-secondary/20 to-primary rounded-2xl p-8 shadow-xl border border-secondary/30"> | |
| <div class="absolute inset-0 bg-grid-white/5 bg-[size:20px_20px]"></div> | |
| <div class="relative z-10 text-center"> | |
| <div class="w-16 h-16 bg-secondary rounded-2xl flex items-center justify-center mx-auto mb-4"> | |
| <i data-feather="smartphone" class="w-8 h-8 text-white"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">Testes Inteligentes</h3> | |
| <p class="text-gray-300 text-sm">Interface moderna e intuitiva para testes automatizados</p> | |
| <div class="flex justify-center mt-4 gap-2"> | |
| <div class="w-2 h-2 bg-secondary rounded-full animate-pulse"></div> | |
| <div class="w-2 h-2 bg-secondary rounded-full animate-pulse delay-150"></div> | |
| <div class="w-2 h-2 bg-secondary rounded-full animate-pulse delay-300"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="grid md:grid-cols-4 gap-6 mt-12"> | |
| <div class="bg-gray-800 p-6 rounded-2xl border border-gray-700"> | |
| <div class="w-12 h-12 bg-secondary bg-opacity-20 rounded-full flex items-center justify-center mb-4"> | |
| <i data-feather="smartphone" class="text-secondary"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">Emuladores Mobile</h3> | |
| <p class="text-gray-400">Acesse diversos emuladores Android e iOS configurados e prontos para uso.</p> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-2xl border border-gray-700"> | |
| <div class="w-12 h-12 bg-secondary bg-opacity-20 rounded-full flex items-center justify-center mb-4"> | |
| <i data-feather="message-square" class="text-secondary"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">Chatbot Inteligente</h3> | |
| <p class="text-gray-400">Teste seus aplicativos usando comandos em linguagem natural.</p> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-2xl border border-gray-700"> | |
| <div class="w-12 h-12 bg-secondary bg-opacity-20 rounded-full flex items-center justify-center mb-4"> | |
| <i data-feather="bar-chart-2" class="text-secondary"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">Relatórios Detalhados</h3> | |
| <p class="text-gray-400">Obtenha insights valiosos sobre o desempenho do seu aplicativo.</p> | |
| </div> | |
| <div class="bg-gray-800 p-6 rounded-2xl border border-gray-700"> | |
| <div class="w-12 h-12 bg-secondary bg-opacity-20 rounded-full flex items-center justify-center mb-4"> | |
| <i data-feather="git-branch" class="text-secondary"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-2">Cenários Organizados</h3> | |
| <p class="text-gray-400">Separe seus testes em cenários como branches para melhor organização.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </main> | |
| <!-- Modal de Início de Teste --> | |
| <div id="testModal" class="fixed inset-0 bg-black bg-opacity-75 hidden flex items-center justify-center z-50 p-4"> | |
| <div class="bg-primary rounded-2xl border border-gray-700 w-full max-w-2xl"> | |
| <div class="p-6 border-b border-gray-700 flex justify-between items-center"> | |
| <h3 class="text-xl font-semibold">Iniciar Novo Teste</h3> | |
| <button onclick="closeTestModal()" class="text-gray-400 hover:text-white"> | |
| <i data-feather="x"></i> | |
| </button> | |
| </div> | |
| <div class="p-6"> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium mb-2">Selecione a Plataforma</label> | |
| <select id="platformSelect" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 text-white focus:border-secondary focus:ring-2 focus:ring-secondary focus:ring-opacity-50" onchange="updateEmulatorOptions()"> | |
| <option value="android">Android</option> | |
| <option value="ios">iOS</option> | |
| </select> | |
| </div> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium mb-2">Selecione o Emulador</label> | |
| <select id="emulatorSelect" class="w-full bg-gray-800 border border-gray-700 rounded-lg px-4 py-3 text-white focus:border-secondary focus:ring-2 focus:ring-secondary focus:ring-opacity-50"> | |
| <option>Android 13 - Pixel 6 Pro</option> | |
| <option>Android 12 - Pixel 5</option> | |
| <option>Android 11 - Pixel 4</option> | |
| <option>Android 10 - Pixel 3</option> | |
| </select> | |
| </div> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium mb-2">Upload do Aplicativo</label> | |
| <div class="border-2 border-dashed border-gray-700 rounded-lg p-8 text-center hover:border-secondary transition-colors duration-300"> | |
| <i data-feather="upload-cloud" class="w-12 h-12 text-gray-500 mx-auto mb-4"></i> | |
| <p class="text-gray-400 mb-2" id="uploadText">Arraste o arquivo .apk ou clique para selecionar</p> | |
| <p class="text-sm text-gray-500">Tamanho máximo: 100MB</p> | |
| <input type="file" class="hidden" id="appUpload" accept=".apk,.ipa"> | |
| <button onclick="document.getElementById('appUpload').click()" class="bg-secondary hover:bg-orange-600 text-white px-4 py-2 rounded-lg mt-4"> | |
| Selecionar Arquivo | |
| </button> | |
| </div> | |
| </div> | |
| <div class="flex justify-end gap-3"> | |
| <button onclick="closeTestModal()" class="px-4 py-2 text-gray-300 hover:text-white transition-colors"> | |
| Cancelar | |
| </button> | |
| <a href="chatbot.html" class="bg-secondary hover:bg-orange-600 text-white px-6 py-2 rounded-lg transition-colors duration-300 flex items-center gap-2"> | |
| <i data-feather="play" class="w-4 h-4"></i> | |
| Iniciar Teste | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="components/sidebar.js"></script> | |
| <script src="script.js"></script> | |
| <script> | |
| feather.replace(); | |
| function openTestModal() { | |
| document.getElementById('testModal').classList.remove('hidden'); | |
| document.getElementById('testModal').classList.add('flex'); | |
| } | |
| function closeTestModal() { | |
| document.getElementById('testModal').classList.add('hidden'); | |
| document.getElementById('testModal').classList.remove('flex'); | |
| } | |
| function updateEmulatorOptions() { | |
| const platform = document.getElementById('platformSelect').value; | |
| const emulatorSelect = document.getElementById('emulatorSelect'); | |
| const uploadText = document.getElementById('uploadText'); | |
| emulatorSelect.innerHTML = ''; | |
| if (platform === 'android') { | |
| uploadText.textContent = 'Arraste o arquivo .apk ou clique para selecionar'; | |
| const androidOptions = [ | |
| 'Android 13 - Pixel 6 Pro', | |
| 'Android 12 - Pixel 5', | |
| 'Android 11 - Pixel 4', | |
| 'Android 10 - Pixel 3' | |
| ]; | |
| androidOptions.forEach(option => { | |
| const opt = document.createElement('option'); | |
| opt.value = option; | |
| opt.textContent = option; | |
| emulatorSelect.appendChild(opt); | |
| }); | |
| } else { | |
| uploadText.textContent = 'Arraste o arquivo .ipa ou clique para selecionar'; | |
| const iosOptions = [ | |
| 'iOS 16 - iPhone 14 Pro', | |
| 'iOS 15 - iPhone 13 Pro', | |
| 'iOS 14 - iPhone 12 Pro', | |
| 'iOS 13 - iPhone 11 Pro' | |
| ]; | |
| iosOptions.forEach(option => { | |
| const opt = document.createElement('option'); | |
| opt.value = option; | |
| opt.textContent = option; | |
| emulatorSelect.appendChild(opt); | |
| }); | |
| } | |
| } | |
| // Atualizar opções de arquivo quando a plataforma mudar | |
| document.getElementById('platformSelect').addEventListener('change', function() { | |
| const platform = this.value; | |
| const fileInput = document.getElementById('appUpload'); | |
| if (platform === 'android') { | |
| fileInput.setAttribute('accept', '.apk'); | |
| } else { | |
| fileInput.setAttribute('accept', '.ipa'); | |
| } | |
| }); | |
| </script> | |
| <script src="https://deepsite.hf.co/deepsite-badge.js"></script> | |
| </body> | |
| </html> |