bom eu estou fazendo um formulário usando html e css, mais também queria integrar java script, bom o projeto é para saber a entrada e saída de funcionário da empresa, e o que eu estava pensando é a partir da hora que for colocado a hora de chegada e saída do funcionário e ele clicar no botão de enviar, o sistema calcular a hora de entrada e saída dele para o outro entrar, mais também queria exibir uma mensagem com a poupup alert avisando pro funcionário que está na hora do outro entrar, mais estou fazendo o curso de java script e não sei ainda como fazer isso, alquem pode me ajudar?
html:
<!DOCTYPE html>
<html lang="pt.br">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="troca-de-turno.css">
<link href="https://fonts.googleapis.com/css?family=Dancing+Script&display=swap" rel="stylesheet">
<title>calculadora inteligente</title>
</head>
<body>
<header>
<h1>ensira seus dados</h1>
</header>
<main>
<div>
<form>
<tbody>
<table>
<th>horario de paola</th>
<th>horario de paula</th>
</table>
</tbody>
<div class="caixa">
<label for="paula">paula </label>
<input type="text" id="paula" required placeholder="horario de chegada">
<input type="text" id="paula" required placeholder="horario de saida" >
<div class="bau">
<label for="paola">paola</label>
<input type="text" id="paola" required placeholder="horario de chegada">
<input type="text" id="paola" required placeholder="horario de saida">
</div>
<input type="submit" value="calcular" class="calcular">
</div>
</form>
</div>
</main>
<script src="troca.js"></script>
</body>
</html>