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