<!doctype html>
|
<html lang="zh-CN">
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<title>访客机自助登记管理平台</title>
|
<link rel="stylesheet" href="./css/styles.css">
|
<link rel="stylesheet" href="./css/components.css">
|
</head>
|
<body>
|
<main class="login-page">
|
<section class="login-card" aria-label="登录">
|
<div class="brand-panel">
|
<img class="brand-avatar" src="./assets/login-avatar.svg" alt="">
|
<h1 id="appTitle">访客机自助登记<br>管理平台</h1>
|
<img class="device-art" src="./assets/login-devices.svg" alt="">
|
</div>
|
|
<div class="form-panel">
|
<form id="loginForm" class="login-form" novalidate>
|
<label id="serverIpGroup" class="input-row" for="serverIp">
|
<span class="field-icon" aria-hidden="true">
|
<svg viewBox="0 0 24 24"><path d="M4 5h16v10H4z"></path><path d="M8 19h8"></path><path d="M12 15v4"></path></svg>
|
</span>
|
<input id="serverIp" name="serverIp" autocomplete="off" placeholder="请输入IP地址">
|
</label>
|
|
<label class="input-row" for="username">
|
<span class="field-icon" aria-hidden="true">
|
<svg viewBox="0 0 24 24"><path d="M12 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8z"></path><path d="M4 21a8 8 0 0 1 16 0"></path></svg>
|
</span>
|
<input id="username" name="username" autocomplete="username" placeholder="请输入用户名">
|
</label>
|
|
<label class="input-row" for="password">
|
<span class="field-icon" aria-hidden="true">
|
<svg viewBox="0 0 24 24"><rect x="6" y="10" width="12" height="10" rx="1.5"></rect><path d="M8 10V7a4 4 0 0 1 8 0v3"></path></svg>
|
</span>
|
<input id="password" name="password" type="password" autocomplete="current-password" placeholder="请输入密码">
|
</label>
|
|
<div class="captcha-line">
|
<label class="input-row captcha-input" for="captcha">
|
<span class="field-icon" aria-hidden="true">
|
<svg viewBox="0 0 24 24"><circle cx="7" cy="12" r="3"></circle><path d="M10 12h10"></path><path d="M16 12v3"></path><path d="M19 12v2"></path></svg>
|
</span>
|
<input id="captcha" name="captcha" autocomplete="off" placeholder="请输入验证码">
|
</label>
|
<button id="captchaBox" class="captcha-box" type="button" title="点击刷新验证码">
|
<span id="captchaText">随机验证码区</span>
|
<img id="captchaImage" alt="验证码" hidden>
|
</button>
|
</div>
|
|
<button class="login-button" type="submit">登录</button>
|
<p id="formMessage" class="form-message" role="status" aria-live="polite"></p>
|
</form>
|
</div>
|
</section>
|
</main>
|
|
<script src="./js/components.js"></script>
|
<script src="./js/config.js"></script>
|
<script src="./js/app.js"></script>
|
</body>
|
</html>
|
