例如下面的页面代码,怎么转为HTML呢
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>登录页面 - ${siteName!""}</title>
<#include "../common/header.ftl"/>
<style>
.lyear-wrapper {
position: relative;
}
.lyear-login {
display: flex !important;
min-height: 100vh;
align-items: center !important;
justify-content: center !important;
}
.login-center {
background: #fff;
min-width: 38.25rem;
padding: 2.14286em 3.57143em;
border-radius: 5px;
margin: 2.85714em 0;
}
.login-header {
margin-bottom: 1.5rem !important;
}
.login-center .has-feedback.feedback-left .form-control {
padding-left: 38px;
padding-right: 12px;
}
.login-center .has-feedback.feedback-left .form-control-feedback {
left: 0;
right: auto;
width: 38px;
height: 38px;
line-height: 38px;
z-index: 4;
color: #dcdcdc;
}
.login-center .has-feedback.feedback-left.row .form-control-feedback {
left: 15px;
}
</style>
</head>
<body>
<div class="row lyear-wrapper">
<div class="lyear-login">
<div class="login-center">
<#--<div class="login-header text-center">-->
<#--<a href=""> <img alt="light year admin" src="/admin/images/logo-sidebar.png"></a>-->
<#--</div>-->
<form id="login-form" method="post">
<div class="form-group has-feedback feedback-left">
<input type="text" placeholder="请输入您的用户名" class="form-control required" name="username" id="username" tips="请填写用户名" />
<span class="mdi mdi-account form-control-feedback" aria-hidden="true"></span>
</div>
<div class="form-group has-feedback feedback-left">
<input type="password" placeholder="请输入密码" class="form-control required" id="password" name="password" tips="请填写密码" />
<span class="mdi mdi-lock form-control-feedback" aria-hidden="true"></span>
</div>
<div class="form-group has-feedback feedback-left row">
<div class="col-xs-7">
<input type="text" name="cpacha" id="cpacha" maxlength="4" class="form-control required" placeholder="验证码" tips="请填验证码" >
<span class="mdi mdi-check-all form-control-feedback" aria-hidden="true"></span>
</div>
<div class="col-xs-5">
<img src="/cpacha/generate_cpacha?vl=4&fs=25&w=128&h=40&method=admin_login" class="pull-right" id="captcha" style="cursor: pointer;" onclick="this.src=this.src+'&d='+Math.random();" title="点击刷新" alt="captcha">
</div>
</div>
<div class="form-group">
<button class="btn btn-block btn-primary" type="button" id="submit-btn">立即登录</button>
</div>
</form>
<hr>
<footer class="col-sm-12 text-center">
<p class="m-b-0">Copyright © 2020 <a href="${siteUrl!""}">【旧物寻主】</a>. All right reserved</p>
</footer>
</div>
</div>
</div>
<#include "../common/footer.ftl"/>
<script type="text/javascript">
$(document).ready(function(){
$("#submit-btn").click(function(){
if(!checkForm("login-form")){
return;
}
var username = $("#username").val();
var password = $("#password").val();
var cpacha = $("#cpacha").val();
$.ajax({
url:'/system/login',
type:'POST',
data:{username:username,password:password,cpacha:cpacha},
dataType:'json',
success:function(data){
if(data.code == 0){
window.location.href = 'index';
}else{
showErrorMsg(data.msg);
}
},
error:function(data){
alert('网络错误!');
}
});
});
});
</script>
</body>
</html>