parent
937b95a50f
commit
f65e6da164
@ -1,63 +1,26 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>菜品列表</title>
|
<title>Main Page</title>
|
||||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% for dish in dishes %}
|
{% for dish in dishes %}
|
||||||
<div>
|
<h2>{{ dish.DishName }}</h2>
|
||||||
<h3>{{ dish.DishName }}</h3>
|
<p>收藏数: {{ dish.CollectNumber }}</p>
|
||||||
|
<p>点赞数: <span id="likeNumber_{{ dish.DishID }}">{{ dish.LikeNumber }}</span></p>
|
||||||
<a href="{{ dish.WebLink }}">查看详情</a>
|
<a href="{{ dish.WebLink }}">查看详情</a>
|
||||||
<button class="like-btn" data-dish="{{ dish.DishName }}">点赞</button>
|
<button onclick="likeDish({{ dish.DishID }})">点赞</button>
|
||||||
<button class="collect-btn" data-dish="{{ dish.DishName }}">收藏</button>
|
|
||||||
<p>点赞数:<span class="like-number">{{ dish.LikeNumber }}</span></p>
|
|
||||||
<p>收藏数:<span class="collect-number">{{ dish.CollectNumber }}</span></p>
|
|
||||||
</div>
|
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
||||||
<button id="refresh-btn">刷新</button>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
var page = 1; // 当前页数
|
function likeDish(dishId) {
|
||||||
|
fetch(`/like_dish/${dishId}/`)
|
||||||
// 加载菜品数据
|
.then(response => response.json())
|
||||||
function loadDishes() {
|
.then(data => {
|
||||||
$.ajax({
|
const likeNumberElement = document.getElementById(`likeNumber_${dishId}`);
|
||||||
url: '/mainpage/',
|
likeNumberElement.textContent = data.likeNumber;
|
||||||
type: 'GET',
|
});
|
||||||
data: { 'page': page },
|
|
||||||
success: function(response) {
|
|
||||||
// 清空原有数据
|
|
||||||
$('div').remove();
|
|
||||||
|
|
||||||
// 添加新的菜品数据
|
|
||||||
for (var i = 0; i < response.dishes.length; i++) {
|
|
||||||
var dish = response.dishes[i];
|
|
||||||
var dishHtml = '<div>' +
|
|
||||||
'<h3>' + dish.DishName + '</h3>' +
|
|
||||||
'<a href="' + dish.WebLink + '">查看详情</a>' +
|
|
||||||
'<button class="like-btn" data-dish="' + dish.DishName + '">点赞</button>' +
|
|
||||||
'<button class="collect-btn" data-dish="' + dish.DishName + '">收藏</button>' +
|
|
||||||
'<p>点赞数:<span class="like-number">' + dish.LikeNumber + '</span></p>' +
|
|
||||||
'<p>收藏数:<span class="collect-number">' + dish.CollectNumber + '</span></p>' +
|
|
||||||
'</div>';
|
|
||||||
$('body').append(dishHtml);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 刷新按钮点击事件
|
|
||||||
$('#refresh-btn').click(function() {
|
|
||||||
page++; // 增加页数
|
|
||||||
loadDishes();
|
|
||||||
});
|
|
||||||
|
|
||||||
// 页面加载完成后加载第一页菜品数据
|
|
||||||
$(document).ready(function() {
|
|
||||||
loadDishes();
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
Loading…
Reference in new issue