quinta-feira, 3 de fevereiro de 2022

Programa de simulaçao de Pizzaria - Software simple feito em HTML ,CSS E JAVASCRIPT

 

PizzariaFrestyleJS
sistema para pizzarias que trabalham com chamadas de javascript direto no navegador. 
Gerenciando as condiçoes de chamada no html, Css e javascript

================================================================================


<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sistemy Pizzas Delivery Web</title>
    <link rel="stylesheet" href="style.css">
    <script src="javascript.js" defer></script>
    <script src="tableToExcel.js" defer></script>
</head>

<body>

    <header>
        <ul>
            <li>
                <h1>Projeto Pizzas</h1>
            </li>
            <li>
                <h2>Vendas de Pizzas</h2>
            </li>
        </ul>
    </header>

    <section>

       
        <form action="">
            <h3>Selecione a Pizza</h3>
            <ul>
                <li><input type="radio" id="mussarela" name="pizzas"><label for="mussarela"> Mussarela</label></li>
                <li><input type="radio" id="mista" name="pizzas"><label  for="mista"> Mista</label></li>
                <li><input type="radio" id="calabresa" name="pizzas"><label  for="calabresa"> Calabresa</label></li>
            </ul>
        </form>
    </section>

    <section>
        <button id="vendas">Vendas</button>
        <button id="estorno">Estorno</button>
    </section>

    <section id="table">
        <table>
            <tr>
                <th>Sabores</th>
                <th>Qunatidade</th>
                <th>Valores</th>
            </tr>
            

            <tr>
                <td>Mussarela</td><td id="resultadoMussarela"></td><td id="vendaMussarela"></td>
            </tr>
            <tr>
                <td>Mista</td><td id="resultadoMista"></td><td id="vendaMista"></td>
            </tr>
            <tr>
                <td>Calabresa</td><td id="resultadoCalabresa"></td><td id="vendaCalabresa"></td>
            </tr>
        </table>
    </section>

    <section>
        <button id="export">Planilha</button>
    </section>

</body>

</html>
================================================================================

'use strict';
//Variaveis 

let somaMussarela = 0;
let somaMista = 0;
let somaCalabresa = 0;
let vendaMussarela = 0.00;
let vendaMista = 0.00;
let vendaCalabresa = 0.00;

let btnVendas = document.getElementById('vendas');
let btnEstorno = document.getElementById('estorno');
let btnPlanilha = document.getElementById('export');

//Eventos onclick
btnVendas.addEventListener('click',venda,false);
btnEstorno.addEventListener('click',estorno,false);
btnPlanilha.addEventListener('click',planilha,false);

//funcoes functions
function venda(e){
    if (document.getElementById('mussarela').checked) {
        somaMussarela = somaMussarela + 1;
        vendaMussarela = vendaMussarela + 25.00;
        document.getElementById('resultadoMussarela').innerHTML = somaMussarela;
        document.getElementById('vendaMussarela').innerHTML = vendaMussarela.toFixed(2);

    }else{
        if (document.getElementById('mista').checked) {
            somaMista = somaMista + 1;
            vendaMista = vendaMista + 29.60;
            document.getElementById('resultadoMista').innerHTML = somaMista;
            document.getElementById('vendaMista').innerHTML = vendaMista.toFixed(2);
        }else{
            if (document.getElementById('calabresa').checked) {
                somaCalabresa = somaCalabresa + 1;
                vendaCalabresa = vendaCalabresa + 22.50;
                document.getElementById('resultadoCalabresa').innerHTML = somaCalabresa;
                document.getElementById('vendaCalabresa').innerHTML = vendaCalabresa.toFixed(2);
            }
        }
    }
}

//======================================================================================================
//funcoes functions
function estorno(e){
    if (document.getElementById('mussarela').checked) {
        somaMussarela = somaMussarela - 1;
        vendaMussarela = vendaMussarela - 25.00;
        if (somaMussarela < 0) {
            somaMussarela = 0;
            vendaMussarela = 0.00;
        }
        document.getElementById('resultadoMussarela').innerHTML = somaMussarela;
        document.getElementById('vendaMussarela').innerHTML = vendaMussarela.toFixed(2);

    }else{
        if (document.getElementById('mista').checked) {
            somaMista = somaMista - 1;
            vendaMista = vendaMista - 29.60;
            if (somaMista < 0) {
                somaMista = 0;
                vendaMista = 0.00;
            }
            document.getElementById('resultadoMista').innerHTML = somaMista;
            document.getElementById('vendaMista').innerHTML = vendaMista.toFixed(2);
        }else{
            if (document.getElementById('calabresa').checked) {
                somaCalabresa = somaCalabresa - 1;
                vendaCalabresa = vendaCalabresa - 22.50;
                if (somaCalabresa <0) {
                    somaCalabresa =0;
                    vendaCalabresa = 0.00;
                }
                document.getElementById('resultadoCalabresa').innerHTML = somaCalabresa;
                document.getElementById('vendaCalabresa').innerHTML = vendaCalabresa.toFixed(2);
            }
        }
    }
}
================================================================================


body{
    margin: auto;
    width: 60%;
}
header{
    display: flex;
    justify-content: center;
    background-color: blue;
    color: #fff;
    text-align: center;
}

header ul li{
    list-style: none;
}

section form ul li{
    list-style: none;
}

section form ul li label{
    font-style: 22px;

}

section{
    margin-top: 1%;
    display: flex;
    justify-content: center;
    font-size: medium;
}

section button{

    margin: 5px;
    font-size: 25px;
}

table, th, td{
    border: 2px solid black;
}

================================================================================


Nenhum comentário:

Postar um comentário