初步完成登录、注册、修改账号、主页内容
This commit is contained in:
@@ -3,34 +3,129 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>我的12306官网</title>
|
||||
<title>KJF航班订票</title>
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/index.css') }}">
|
||||
<script src="{{ url_for('static', filename='js/index.js') }}" defer></script>
|
||||
<script src="https://cdn.bootcss.com/blueimp-md5/2.12.0/js/md5.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>中国铁路12306</h1>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="{{ url_for('index') }}">首页</a></li>
|
||||
<li><a href="{{ url_for('signup') }}">注册</a></li>
|
||||
<li><a href="{{ url_for('modify') }}">修改账号</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="header-content">
|
||||
<div class="logo">KJF航班订票</div>
|
||||
<div class="nav-buttons">
|
||||
<a href="{{ url_for('index') }}">首页</a>
|
||||
<a href="{{ url_for('orders') }}">我的订单</a>
|
||||
</div>
|
||||
<div class="user-menu">
|
||||
<span>{{ username }}</span>
|
||||
<div class="dropdown">
|
||||
<button class="dropbtn">▼</button>
|
||||
<div class="dropdown-content">
|
||||
<a href="{{ url_for('modify') }}">修改账户信息</a>
|
||||
<a href="{{ url_for('logout') }}">退出登录</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
<div class="background-container">
|
||||
<div class="content">
|
||||
<h2>尽享精彩出行服务</h2>
|
||||
<div class="links">
|
||||
<a class="btn" href="{{ url_for('signup') }}">点击跳转注册</a>
|
||||
<a class="btn" href="{{ url_for('modify') }}">点击跳转修改账号</a>
|
||||
</div>
|
||||
<div class="slides">
|
||||
<ul id="slide-container">
|
||||
{% for image in images %}
|
||||
<li>
|
||||
<a href="{{ image.link }}" target="_blank">
|
||||
<img src="{{ image.src }}">
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div id="ticket" class="tabcontent" style="display: block;">
|
||||
<form action="{{ url_for('search') }}" method="get" class="search-form" onsubmit="return validateForm()">
|
||||
<div class="form-row">
|
||||
<label for="departure">出发地:</label>
|
||||
<select id="departure" name="departure">
|
||||
<option value="北京">北京</option>
|
||||
<option value="上海">上海</option>
|
||||
<option value="广州">广州</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label for="destination">目的地:</label>
|
||||
<select id="destination" name="destination">
|
||||
<option value="北京">北京</option>
|
||||
<option value="上海">上海</option>
|
||||
<option value="广州">广州</option>
|
||||
</select>
|
||||
<div id="destination-warning" class="error-message"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label for="departure-date">出发日期:</label>
|
||||
<input type="date" id="departure-date" name="departure-date">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label for="passengers">乘客人数:</label>
|
||||
<div class="passenger-input">
|
||||
<button type="button" onclick="decrement()">-</button>
|
||||
<input type="number" id="passengers" name="passengers" value="1" min="1" max="50">
|
||||
<button type="button" onclick="increment()">+</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<button type="submit" class="btn">立即查询</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
<p>© 2024 中国铁路12306. 保留所有权利。</p>
|
||||
<p>© 2024 KJF航班订票. 保留所有权利。</p>
|
||||
</footer>
|
||||
<script src="{{ url_for('static', filename='js/slideshow.js') }}"></script>
|
||||
<script>
|
||||
function validateForm() {
|
||||
var departure = document.getElementById('departure').value;
|
||||
var destination = document.getElementById('destination').value;
|
||||
var warning = document.getElementById('destination-warning');
|
||||
if (departure === destination) {
|
||||
warning.textContent = '出发地和目的地不能相同';
|
||||
return false;
|
||||
} else {
|
||||
warning.textContent = '';
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
function openTab(evt, tabName) {
|
||||
var i, tabcontent, tablinks;
|
||||
tabcontent = document.getElementsByClassName("tabcontent");
|
||||
for (i = 0; i < tabcontent.length; i++) {
|
||||
tabcontent[i].style.display = "none";
|
||||
}
|
||||
tablinks = document.getElementsByClassName("tablinks");
|
||||
for (i = 0; i < tablinks.length; i++) {
|
||||
tablinks[i].className = tablinks[i].className.replace(" active", "");
|
||||
}
|
||||
document.getElementById(tabName).style.display = "block";
|
||||
evt.currentTarget.className += " active";
|
||||
}
|
||||
|
||||
function increment() {
|
||||
var passengers = document.getElementById("passengers");
|
||||
var value = parseInt(passengers.value, 10);
|
||||
if (value < 50) {
|
||||
passengers.value = value + 1;
|
||||
}
|
||||
}
|
||||
|
||||
function decrement() {
|
||||
var passengers = document.getElementById("passengers");
|
||||
var value = parseInt(passengers.value, 10);
|
||||
if (value > 1) {
|
||||
passengers.value = value - 1;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user