<html>
<head>
<meta charset="UTF-8">
<script>
var saldoEnCuenta = 3000
let mensaje1 = "Saldo Actualizado, le queda: $"
let mensaje2 = "Gracias, Hasta pronto"
let mensaje3 = "Saldo Insuficiente, necesita depositar mas.!"
let mensaje4 = " Gracias por usar nuestro banco"
function ingresar(){
let cid = document.getElementById("id").value;
let cpass = document.getElementById("pass").value;
if(cpass == "12345"){
document.getElementById("usuario0").style.display = "none"
document.getElementById("pass0").style.display = "none"
document.getElementById("id").style.display = "none"
document.getElementById("pass").style.display = "none"
document.getElementById("ingresa").style.display = "none"
alert("Acceso Correcto");
document.getElementById("id").value = ""
document.getElementById("pass").value = ""
document.getElementById("montoOperacion").style.display = "block"
document.getElementById("resultadoOperacion").style.display = "block"
document.getElementById("depositar").style.display = "block"
document.getElementById("retirar").style.display = "block"
document.getElementById("exit").style.display = "block"
document.getElementById("estadoCta").style.display = "block"
document.getElementById("titulo").style.display = "block"
document.getElementById("titulo2").style.display = "block"
document.getElementById("usuario").style.display = "block"
}else{
alert("contraseña incorrecta");
}
}
function Retirar(){
let retirar = parseFloat(document.getElementById("montoOperacion").value);
if(retirar > 0){
if (saldoEnCuenta >= retirar){
saldoEnCuenta = saldoEnCuenta - retirar;
document.getElementById("resultadoOperacion").value = mensaje1+saldoEnCuenta+mensaje4;
//preguntaOperacion()
}else{
document.getElementById("resultadoOperacion").value = mensaje3;
//preguntaOperacion()
}
}else{
alert("ingresar un monto para la operacion")
}
limpiarMontoOp();
}
function Depositar(){
let deposito = parseFloat(document.getElementById("montoOperacion").value);
saldoEnCuenta = saldoEnCuenta + deposito;
document.getElementById("resultadoOperacion").value = mensaje1+saldoEnCuenta+mensaje4;
limpiarMontoOp();
}
function Salir(){
alert(mensaje2);
document.getElementById("usuario0").style.display = "block"
document.getElementById("id").style.display = "block"
document.getElementById("pass0").style.display = "block"
document.getElementById("pass").style.display = "block"
document.getElementById("ingresa").style.display = "block"
document.getElementById("montoOperacion").style.display = "none"
document.getElementById("resultadoOperacion").style.display = "none"
document.getElementById("depositar").style.display = "none"
document.getElementById("retirar").style.display = "none"
document.getElementById("estadoCta").style.display = "none"
document.getElementById("exit").style.display = "none"
document.getElementById("titulo").style.display = "none"
document.getElementById("titulo2").style.display = "none"
document.getElementById("usuario").style.display = "none"
}
function EstadoCuenta(){
document.getElementById("resultadoOperacion").value = mensaje1+saldoEnCuenta+mensaje4
}
function limpiarMontoOp(){
document.getElementById("montoOperacion").value = ""
}
</script>
</head>
<body>
<h1>CAJERO AUTOMATICO</h3>
<h3 id="usuario0" ">USUARIO</h3><BR/>
<input type="text" id="id"/><br>
<h3 id="pass0">CONTRASEÑA</h3><BR/>
<input type="text" id="pass"/><br>
<input type="button" id="ingresa" onclick="ingresar();" value="INGRESAR">
<h2 id="usuario" style="display: none;">BIENVENIDO</h3>
<h3 id="titulo" style="display: none;">monto</h3>
<input type="number" id="montoOperacion" style="display: none;"/><br>
<h3 id="titulo2" style="display: none;">resultado</h3>
<input type="text" id="resultadoOperacion" style="display: none;;width: 80%"/><br>
<input type="button" id="retirar" onclick="Retirar();" style="display: none" value="RETIRAR">
<input type="button" id="depositar" onclick="Depositar();" style="display: none;" value="DEPOSITAR">
<input type="button" id="estadoCta" onclick="EstadoCuenta();" style="display: none;" value="Estado de Cuenta">
<input type="button" id="exit" onclick="Salir();" style="display: none;" value="SALIR">
<!--<button id="ingresa" onclick="ingresar()">Ingresar</button>-->
</body>
</html>
