commit
9a74569d4c
4 changed files with 137 additions and 0 deletions
@ -0,0 +1,42 @@ |
|||
from flask import Flask, jsonify, send_from_directory |
|||
|
|||
app = Flask(__name__, static_folder="public", static_url_path="") |
|||
|
|||
|
|||
# 根路径返回 index.html |
|||
@app.route("/") |
|||
def serve_index(): |
|||
return send_from_directory(app.static_folder, "index.html") |
|||
|
|||
|
|||
# API 子路径,提供减肥计划数据 |
|||
@app.route("/api/weight-loss-plan") |
|||
def weight_loss_plan(): |
|||
plan = { |
|||
"message": "Welcome to the Weight Loss Plan", |
|||
"plan": { |
|||
"week1": { |
|||
"monday": {"meal": "Salad with grilled chicken", "calories": 300}, |
|||
"tuesday": {"meal": "Veggie stir-fry with tofu", "calories": 250}, |
|||
"wednesday": {"meal": "Quinoa salad", "calories": 350}, |
|||
"thursday": {"meal": "Grilled fish with steamed vegetables", "calories": 400}, |
|||
"friday": {"meal": "Lentil soup", "calories": 300}, |
|||
"saturday": {"meal": "Greek yogurt with berries", "calories": 200}, |
|||
"sunday": {"meal": "Baked sweet potato with cottage cheese", "calories": 350} |
|||
}, |
|||
"week2": { |
|||
"monday": {"meal": "Oatmeal with almond milk", "calories": 300}, |
|||
"tuesday": {"meal": "Chicken breast with broccoli", "calories": 350}, |
|||
"wednesday": {"meal": "Chickpea salad", "calories": 300}, |
|||
"thursday": {"meal": "Turkey burger with lettuce wrap", "calories": 400}, |
|||
"friday": {"meal": "Vegetable sushi rolls", "calories": 250}, |
|||
"saturday": {"meal": "Smoothie with spinach and banana", "calories": 200}, |
|||
"sunday": {"meal": "Egg white omelette with avocado", "calories": 300} |
|||
} |
|||
} |
|||
} |
|||
return jsonify(plan) |
|||
|
|||
|
|||
if __name__ == "__main__": |
|||
app.run(debug=True,host="0.0.0.0", port=80) |
@ -0,0 +1,20 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|||
<title>Weight Loss Plan</title> |
|||
<link rel="stylesheet" href="styles.css"> |
|||
</head> |
|||
<body> |
|||
<div class="container"> |
|||
<h1>Weight Loss Plan</h1> |
|||
<div id="plan-container"> |
|||
<h2>Weekly Meal Plan</h2> |
|||
<div id="plan-week1"></div> |
|||
<div id="plan-week2"></div> |
|||
</div> |
|||
</div> |
|||
<script src="script.js"></script> |
|||
</body> |
|||
</html> |
@ -0,0 +1,33 @@ |
|||
document.addEventListener("DOMContentLoaded", () => { |
|||
fetch("/api/weight-loss-plan") |
|||
.then(response => response.json()) |
|||
.then(data => { |
|||
const week1 = document.getElementById("plan-week1"); |
|||
const week2 = document.getElementById("plan-week2"); |
|||
|
|||
const renderPlan = (week, weekData) => { |
|||
const days = Object.keys(weekData); |
|||
days.forEach(day => { |
|||
const meal = weekData[day]; |
|||
const dayDiv = document.createElement("div"); |
|||
dayDiv.classList.add("day"); |
|||
|
|||
const dayHeader = document.createElement("h3"); |
|||
dayHeader.textContent = `${day.charAt(0).toUpperCase() + day.slice(1)}`; |
|||
dayDiv.appendChild(dayHeader); |
|||
|
|||
const mealInfo = document.createElement("p"); |
|||
mealInfo.textContent = `Meal: ${meal.meal} (Calories: ${meal.calories})`; |
|||
dayDiv.appendChild(mealInfo); |
|||
|
|||
week.appendChild(dayDiv); |
|||
}); |
|||
}; |
|||
|
|||
renderPlan(week1, data.plan.week1); |
|||
renderPlan(week2, data.plan.week2); |
|||
}) |
|||
.catch(error => { |
|||
console.error("Error fetching data:", error); |
|||
}); |
|||
}); |
@ -0,0 +1,42 @@ |
|||
body { |
|||
font-family: Arial, sans-serif; |
|||
background-color: #f4f4f4; |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
|||
|
|||
.container { |
|||
max-width: 800px; |
|||
margin: 20px auto; |
|||
padding: 20px; |
|||
background: white; |
|||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
|||
border-radius: 8px; |
|||
} |
|||
|
|||
h1, h2 { |
|||
text-align: center; |
|||
color: #333; |
|||
} |
|||
|
|||
#plan-container { |
|||
margin-top: 20px; |
|||
} |
|||
|
|||
.day { |
|||
background: #e9f2ff; |
|||
padding: 10px; |
|||
margin-bottom: 10px; |
|||
border-radius: 5px; |
|||
} |
|||
|
|||
.day h3 { |
|||
margin: 0 0 5px; |
|||
color: #007bff; |
|||
} |
|||
|
|||
.day p { |
|||
margin: 0; |
|||
font-size: 14px; |
|||
color: #555; |
|||
} |
Loading…
Reference in new issue