Current File : /home/exataengenharia/public_html/resources/views/usuarios/create.blade.php

<style>
    .container__create__informations {
        padding: 0;
    }

    .links {
        font-size: 18px;    
    }

    .links a {
        text-decoration: none;
    }
</style>            
<x-layout title="Adicionar campos">
    <div class="container__create__informations">
        <form class="container " method="POST" action="{{ route('store') }}" enctype="multipart/form-data">
            @csrf
            <div class="mb-3">
                <label for="exampleInputEmail1" class="form-label">Tipo de Residência</label>
                <input type="text" class="form-control" id="exampleInputEmail1" required aria-describedby="emailHelp" name="residence">
                <div id="emailHelp" class="form-text">Preencha todas as informações corretamente.</div>
            </div>
            <div class="mb-3">
                <label for="exampleInputEmail1" class="form-label">Geração mensal</label>
                <input type="text" class="form-control monthly-generation-input" required id="exampleInputEmail1" aria-describedby="emailHelp" name="monthly_generation" oninput="formatInput(this)">
                <div id="emailHelp" class="form-text">Preencha todas as informações corretamente.</div>
            </div>
            <div class="mb-3">
                <label for="exampleInputEmail1" class="form-label">Economia Anual gerada</label>
                <input type="text" class="form-control annual-savings-input" required id="exampleInputEmail1" aria-describedby="emailHelp" name="annual_savings" oninput="formatInput(this)">
                <div id="emailHelp" class="form-text">Preencha todas as informações corretamente.</div>
            </div>

            <div class="mb-3">
                <label for="exampleInputEmail1" class="form-label">Imagem</label>
                <input type="file" name="path" onchange="displaySelectedImage(this);">
                <img id="preview-image" src="./img/not_image.png" style="max-width: 200px;">
            </div>
            <button type="submit" class="btn btn-primary">Salvar informações</button>

        </form>
    </div>
</x-layout>
<script>
    // Função para exibir a imagem selecionada
    function displaySelectedImage(input) {
        var preview = document.getElementById('preview-image');
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function(e) {
                preview.src = e.target.result;
            };
            reader.readAsDataURL(input.files[0]);
        } else {
            preview.src = './img/not_image.png';
        }
    }
    
    // Função para formatar o valor de entrada com separador de milhares
    function formatInput(input) {
        var value = input.value.replace(/\D/g, ''); // Remove todos os caracteres não numéricos
        var formattedValue = new Intl.NumberFormat('pt-BR').format(value); // Formata o valor com separador de milhares
        input.value = formattedValue;
    }
</script>