Fmovel/Modelo Relatorio.html

199 lines
12 KiB
HTML

<html>
<head>
<title>
Relatorio
</title>
</head>
<body>
<div style="width: 100%; height: auto;">
<!--CABECALHO-->
<div style="border: 2px solid; width: 100%; height: 5em; text-align: center; position: relative;">
<img src="file:///C:/Logo.png" style="position: absolute; left: 7px; top: 7px; height: 67px;">
<div><h2 style="margin: 7px;">Relatorio detalhado de veiculos</h2></div>
<div><h3>13/03/2021</h3></div>
<div style="position: absolute; right: 0; top: 0; border-left: 2px solid; height: 100%; width: 6em;">
<div style="height: 30%; border-bottom: 2px solid; display: flex; justify-content: center; align-items: center;">Cod: 1</div>
<div style="height: 20%;">Pagina</div>
<div style="height: 50%; display: flex; justify-content: center; align-items: center; font-size: 25px;">1/1</div>
</div>
</div>
<!--CLIENTE-->
<div style="margin-top: 1em; border: 2px solid; width: 60%; height: 3em; position: relative;">
<div style="height: 50%; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Cliente</label>
</div>
<div style="height: 50%; display: flex; align-items: center; text-indent: 1.5em;">
<span>Diego Freitas da Costa</span>
</div>
</div>
<div style="margin-top: 1em; border: 2px solid; width: 40%; height: 3em; position: relative; float: right; top: -68px; right: -6px;">
<div style="height: 50%; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Telefone</label>
</div>
<div style="height: 50%; display: flex; align-items: center; text-indent: 1.5em;">
<span>(19) 99871-7560</span>
</div>
</div>
<!--MODELO-->
<div style="border: 2px solid; width: 60%; height: 11em; position: relative; margin-top: -2px;">
<div style="height: 3em; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Dados do modelo</label>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>FABRICANTE</span> <label style="font-weight: bold;">CHEVROLET</label>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>TABELA FIPE</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>DEPRECIACÃO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>PORTE</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>CATEGORIA</span>
</div>
</div>
<!--OPCIONAIS-->
<div style="border: 2px solid; width: 40%; height: 18.5em; position: relative; margin-left: 60%; top: -11.25em; right: -2px;">
<div style="height: 3em; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Opcionais</label>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>VIDROS ELETRICOS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>TRAVAS ELETRICAS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>AR CONDICIONADO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>SOM</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>AIRBAG</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>ALARME</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>ABS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>REGULAGEM DE VOLANTE</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>SENSOR DE RE</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>CAMERA DE RE</span>
</div>
</div>
<!--VERSAO-->
<div style="border: 2px solid; width: 60%; height: 26em; position: relative; margin-top: -18.9em;">
<div style="height: 3em; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Dados da versão</label>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>VERSÃO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>MOTOR</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>ANO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>DIRECÃO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>VALOR IPVA</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>PORTAS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>CAMBIO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>COMBUSTIVEL</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>PLACA</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>RENAVAM</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>COR</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>QUILOMETRAGEM</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>CHASSIS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em;">
<span>SITUACÃO</span>
</div>
</div>
<!--ESTADO-->
<div style="border: 2px solid; width: 40%; height: 18.5em; position: relative; margin-left: 60%; top: -18.7em; right: -2px;">
<div style="height: 3em; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Estado do veiculo</label>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>FUNILARIA</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>PINTURA</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>MOTOR</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>CAMBIO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>SUSPENSÃO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>FREIOS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>PNEUS</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>DIRECÃO</span>
</div>
<div style="height: 1.5em; display: flex; align-items: center; text-indent: 1.5em; padding-left: 1em;">
<input type="checkbox"> <span>ELETRICA</span>
</div>
</div>
<!--RODAPE-->
<div style="margin-top: -17em; border: 2px solid; width: 30%; height: 3em; position: relative;">
<div style="height: 50%; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Atendente</label>
</div>
<div style="height: 50%; display: flex; align-items: center; text-indent: 1.5em;">
<span>Diego Freitas da Costa</span>
</div>
</div>
<div style="margin-top: -3.2em; border: 2px solid; width: 70%; height: 3em; position: relative; margin-left: 30.2%;">
<div style="height: 50%; display: flex; align-items: center;">
<label style="font-weight: bold; text-indent: 0.5em;">Estacionamento do Gustavo</label>
</div>
<div style="height: 50%; display: flex; align-items: center; text-indent: 1.5em;">
<span>Rua das Gaivotas, 425 - Centro Leme SP - Telefone (19) 3554-8849 / Seg a Sex 09:00 as 18:30</span>
</div>
</div>
</div>
</body>
</html>