diff --git a/index.css b/index.css index 4ad301a..2aa8c83 100644 --- a/index.css +++ b/index.css @@ -3,25 +3,27 @@ body { font-family: Arial, sans-serif; background-color: #f0f8ff; /* Azul claro no fundo */ display: flex; - justify-content: center; - align-items: center; + justify-content: space-between; /* Espaço entre as divs */ height: 100vh; margin: 0; } h1 { - color: #338be9 + color: #338be9; } -/* Container centralizado */ +/* Container com 50% da largura da tela */ .container { background-color: #ffffff; border-radius: 15px; /* Cantos arredondados */ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); padding: 20px; - max-width:400px ; - width: 100%; - text-align: center; + width: 50%; /* 50% da largura da tela */ + box-sizing: border-box; /* Inclui padding e border no cálculo da largura */ +} + +#paste__code textarea{ + height: 80vh; } /* Estilo dos inputs e textarea */ @@ -47,22 +49,23 @@ button { font-size: 16px; } -label{ - color: #338be9 +label { + font-size: 0.8em; + color: #338be9; } #plano, -#setor{ +#setor { width: 37%; padding: 5px; margin: 8px 0; border-radius: 10px; border: 1px solid #ccc; - color: #338be9 + color: #338be9; } #copy, -#clear{ +#clear { max-width: fit-content; } @@ -70,10 +73,9 @@ button:hover { background-color: #0056b3; /* Cor ao passar o mouse */ } - /* Estilo para o textarea de mensagem */ textarea { - height: 100px; + height: 65px; } /* Estilo para o aviso temporário */ diff --git a/index.html b/index.html index e855423..e2be5b8 100644 --- a/index.html +++ b/index.html @@ -3,13 +3,16 @@ - Formatar Telefone + Olist Transfer +
+ + +
-

Olist ERP

@@ -20,7 +23,7 @@

Olist ERP

- + - - diff --git a/index.js b/index.js index 623a0ae..41712e7 100644 --- a/index.js +++ b/index.js @@ -1,4 +1,28 @@ -// Função para formatar telefone e gerar a mensagem +function preencherDados() { + const dados = document.querySelector('#paste__code textarea').value; + + // Expressões regulares para extrair os dados + const telefoneRegex = /Celular\s*\n?\s*(\(\d{2}\)\s*\d{5}-\d{4})/; + const emailRegex = /E-mail\s*\n?\s*([a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})/; + const cnpjRegex = /CNPJ\s*\n?\s*([\d]{2}\.[\d]{3}\.[\d]{3}\/[\d]{4}-[\d]{2})/; + + // Extraindo os dados + const telefoneMatch = dados.match(telefoneRegex); + const emailMatch = dados.match(emailRegex); + const cnpjMatch = dados.match(cnpjRegex); + + // Verifica se encontrou os dados e extrai os valores + const telefone = telefoneMatch ? telefoneMatch[1] : 'Não encontrado'; + const email = emailMatch ? emailMatch[1] : 'Não encontrado'; + const cnpj = cnpjMatch ? cnpjMatch[1] : 'Não encontrado'; + + // Preencher os campos com os dados extraídos + document.getElementById('telefone').value = telefone; + document.getElementById('email').value = email; + document.getElementById('cnpj').value = cnpj; +} + +// Função para formatar dados e gerar a mensagem function formatarTelefone() { let telefone = document.getElementById("telefone").value; let cnpj = document.getElementById("cnpj").value; @@ -28,8 +52,7 @@ function formatarTelefone() { } // Gerar a mensagem - let mensagem = ` -Boa tarde! + let mensagem = `Boa tarde! Seller deseja um contato para: Transferencia para o time: ${setor} Plano: ${plano} @@ -38,8 +61,7 @@ E-mail: ${email} Ticket Origem: ${ticket} Ligar no telefone: ${telefone} -Obrigado, Pessoal! - `; +Obrigado, Pessoal!`; // Exibir a mensagem no textarea document.getElementById("mensagem").value = mensagem;