220 lines
11 KiB
HTML
220 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>KJF航班订票</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/index.css') }}">
|
|
<script>
|
|
window.onload = function() {
|
|
{% with messages = get_flashed_messages() %}
|
|
{% if messages %}
|
|
var message = "";
|
|
{% for msg in messages %}
|
|
message += "{{ msg }}\n";
|
|
{% endfor %}
|
|
alert(message);
|
|
{% endif %}
|
|
{% endwith %}
|
|
};
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="header-content">
|
|
<div class="logo">KJF航班订票</div>
|
|
<div class="nav-buttons">
|
|
<a href="{{ url_for('index') }}">首页</a>
|
|
</div>
|
|
<div class="user-menu">
|
|
<span>{{ username }}</span>
|
|
<div class="dropdown">
|
|
<button class="dropbtn">▼</button>
|
|
<div class="dropdown-content">
|
|
<a href="{{ url_for('logout') }}">退出登录</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<main>
|
|
<div class="content">
|
|
<form method="get" action="{{ url_for('index') }}">
|
|
<div class="form-group">
|
|
<label for="flightID">航班号:</label>
|
|
<input type="text" id="flightID" name="flightID" placeholder="请输入航班号">
|
|
</div>
|
|
<button type="submit" class="btn">查询</button>
|
|
</form>
|
|
|
|
{% if flight %}
|
|
<div class="flight-info">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>航班号</th>
|
|
<th>航空公司</th>
|
|
<th>出发机场</th>
|
|
<th>到达机场</th>
|
|
<th>出发时间</th>
|
|
<th>到达时间</th>
|
|
<th>头等舱剩余座位</th>
|
|
<th>商务舱剩余座位</th>
|
|
<th>经济舱剩余座位</th>
|
|
<th>头等舱价格</th>
|
|
<th>商务舱价格</th>
|
|
<th>经济舱价格</th>
|
|
<th>状态</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="flight-row">
|
|
<td>{{ flight.ID }}</td>
|
|
<td>{{ flight.Airline }}</td>
|
|
<td>{{ flight.Departure_airport }}</td>
|
|
<td>{{ flight.Arrival_airport }}</td>
|
|
<td>{{ flight.Departure_time }}</td>
|
|
<td>{{ flight.Arrival_time }}</td>
|
|
<td id="first-class-seats">{{ flight.First_class_seats_remaining }}</td>
|
|
<td id="business-class-seats">{{ flight.Business_class_seats_remaining }}</td>
|
|
<td id="economy-class-seats">{{ flight.Economy_class_seats_remaining }}</td>
|
|
<td id="first-class-price">{{ flight.First_class_price }}</td>
|
|
<td id="business-class-price">{{ flight.Business_class_price }}</td>
|
|
<td id="economy-class-price">{{ flight.Economy_class_price }}</td>
|
|
<td>{{ flight.Status }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="modify-seats">
|
|
<h3>修改座位数、价格及状态</h3>
|
|
<form id="modify-form" method="post" action="{{ url_for('modify') }}" onsubmit="return validateSeatChange()">
|
|
<input type="hidden" name="flightID" value="{{ flight.ID }}">
|
|
<div class="form-group">
|
|
<label for="first_class_change">头等舱座位变化:</label>
|
|
<div class="passenger-input">
|
|
<button type="button" onclick="decrement('first_class_change', {{ flight.First_class_seats_remaining }})">-</button>
|
|
<input type="number" id="first_class_change" name="first_class_change" placeholder="输入变化数量" value="0">
|
|
<button type="button" onclick="increment('first_class_change')">+</button>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="business_class_change">商务舱座位变化:</label>
|
|
<div class="passenger-input">
|
|
<button type="button" onclick="decrement('business_class_change', {{ flight.Business_class_seats_remaining }})">-</button>
|
|
<input type="number" id="business_class_change" name="business_class_change" placeholder="输入变化数量" value="0">
|
|
<button type="button" onclick="increment('business_class_change')">+</button>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="economy_class_change">经济舱座位变化:</label>
|
|
<div class="passenger-input">
|
|
<button type="button" onclick="decrement('economy_class_change', {{ flight.Economy_class_seats_remaining }})">-</button>
|
|
<input type="number" id="economy_class_change" name="economy_class_change" placeholder="输入变化数量" value="0">
|
|
<button type="button" onclick="increment('economy_class_change')">+</button>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="first_class_price">头等舱价格:</label>
|
|
<input type="number" step="0.01" id="first_class_price" name="first_class_price" placeholder="输入价格" value="{{ flight.First_class_price }}" oninput="validatePrice(this)">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="business_class_price">商务舱价格:</label>
|
|
<input type="number" step="0.01" id="business_class_price" name="business_class_price" placeholder="输入价格" value="{{ flight.Business_class_price }}" oninput="validatePrice(this)">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="economy_class_price">经济舱价格:</label>
|
|
<input type="number" step="0.01" id="economy_class_price" name="economy_class_price" placeholder="输入价格" value="{{ flight.Economy_class_price }}" oninput="validatePrice(this)">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="status">航班状态:</label>
|
|
<select id="status" name="status">
|
|
<option value="候机中" {% if flight.Status == '候机中' %}selected{% endif %}>候机中</option>
|
|
<option value="延误" {% if flight.Status == '延误' %}selected{% endif %}>延误</option>
|
|
<option value="已起飞" {% if flight.Status == '已起飞' %}selected{% endif %}>已起飞</option>
|
|
<option value="已降落" {% if flight.Status == '已降落' %}selected{% endif %}>已降落</option>
|
|
<option value="开始检票" {% if flight.Status == '开始检票' %}selected{% endif %}>开始检票</option>
|
|
<option value="未知" {% if flight.Status == '未知' %}selected{% endif %}>未知</option>
|
|
</select>
|
|
</div>
|
|
<button type="submit" class="btn">提交</button>
|
|
</form>
|
|
</div>
|
|
<div class="flight-actions">
|
|
<h3>其他操作</h3>
|
|
<button class="btn" onclick="deleteFlight('{{ flight.ID }}')">删除航班</button>
|
|
<form id="upload-csv-form" method="post" action="{{ url_for('upload_csv') }}" enctype="multipart/form-data">
|
|
<input type="file" name="file" accept=".csv" required>
|
|
<button type="submit" class="btn">批量添加航班</button>
|
|
</form>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</main>
|
|
<footer>
|
|
<p>© 2024 KJF航班订票. 保留所有权利。</p>
|
|
</footer>
|
|
<script>
|
|
function validateSeatChange() {
|
|
const firstClassSeats = parseInt(document.getElementById('first-class-seats').textContent);
|
|
const businessClassSeats = parseInt(document.getElementById('business-class-seats').textContent);
|
|
const economyClassSeats = parseInt(document.getElementById('economy-class-seats').textContent);
|
|
|
|
const firstClassChange = parseInt(document.getElementById('first_class_change').value || 0);
|
|
const businessClassChange = parseInt(document.getElementById('business_class_change').value || 0);
|
|
const economyClassChange = parseInt(document.getElementById('economy_class_change').value || 0);
|
|
|
|
const newFirstClassSeats = firstClassSeats + firstClassChange;
|
|
const newBusinessClassSeats = businessClassSeats + businessClassChange;
|
|
const newEconomyClassSeats = economyClassSeats + economyClassChange;
|
|
|
|
if (newFirstClassSeats < 0 || newBusinessClassSeats < 0 || newEconomyClassSeats < 0) {
|
|
alert('座位变化后余座数不能为负值');
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
|
|
function validatePrice(input) {
|
|
const value = parseFloat(input.value);
|
|
if (isNaN(value) || value < 0) {
|
|
input.setCustomValidity('价格不能为负值且仅支持小数点后2位');
|
|
} else {
|
|
input.setCustomValidity('');
|
|
}
|
|
}
|
|
|
|
function increment(inputId) {
|
|
var inputElement = document.getElementById(inputId);
|
|
var value = parseInt(inputElement.value, 10);
|
|
inputElement.value = value + 1;
|
|
}
|
|
|
|
function decrement(inputId, remainingSeats) {
|
|
var inputElement = document.getElementById(inputId);
|
|
var value = parseInt(inputElement.value, 10);
|
|
if (remainingSeats + value > 0) {
|
|
inputElement.value = value - 1;
|
|
}
|
|
}
|
|
|
|
function deleteFlight(flightID) {
|
|
if (confirm('确定要删除此航班吗？')) {
|
|
fetch(`{{ url_for('delete_flight') }}?flightID=${flightID}`, {
|
|
method: 'DELETE'
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
alert(data.message);
|
|
if (data.success) {
|
|
window.location.href = "{{ url_for('index') }}";
|
|
}
|
|
})
|
|
.catch(error => console.error('Error:', error));
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|