first commit

1 month ago · e01b0ecc39
4 changed files with 170 additions and 0 deletions
--- a/app.py
+++ b/app.py
@ -0,0 +1,36 @@
+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/travel-guide")
+def api_travel_guide():
+    # 模拟徐州游玩攻略数据
+    travel_guide = {
+        "message": "徐州游玩攻略",
+        "data": {
+            "places": [
+                {"name": "云龙湖", "description": "徐州的标志性景点，湖光山色，风景优美。"},
+                {"name": "徐州博物馆", "description": "展示徐州的历史文化遗产，适合了解徐州的历史。"},
+                {"name": "彭祖园", "description": "以彭祖文化为主题的公园，适合休闲散步。"}
+            ],
+            "food": [
+                {"name": "徐州烙馍卷", "description": "徐州特色小吃，薄饼卷上各种馅料，非常美味。"},
+                {"name": "地锅鸡", "description": "徐州传统美食，鸡肉鲜嫩，锅贴香脆。"},
+                {"name": "糖醋黄河鲤鱼", "description": "徐州特色菜肴，鱼肉鲜嫩，酸甜适口。"}
+            ],
+            "itinerary": [
+                {"day": "第一天", "activities": ["上午：游览云龙湖", "下午：参观徐州博物馆", "晚上：品尝徐州烙馍卷"]},
+                {"day": "第二天", "activities": ["上午：彭祖园散步", "下午：自由活动", "晚上：品尝地锅鸡"]}
+            ]
+        }
+    }
+    return jsonify(travel_guide)
+
+if __name__ == "__main__":
+    app.run(debug=True, port=80)
--- a/public/index.html
+++ b/public/index.html
@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>徐州游玩攻略</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div class="container">
+        <h1>徐州游玩攻略</h1>
+        <div id="places-container">
+            <h2>景点推荐</h2>
+        </div>
+        <div id="food-container">
+            <h2>美食推荐</h2>
+        </div>
+        <div id="itinerary-container">
+            <h2>行程安排</h2>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
--- a/public/script.js
+++ b/public/script.js
@ -0,0 +1,69 @@
+document.addEventListener("DOMContentLoaded", function () {
+    fetch("/api/travel-guide")
+        .then(response => response.json())
+        .then(data => {
+            const placesContainer = document.getElementById("places-container");
+            const foodContainer = document.getElementById("food-container");
+            const itineraryContainer = document.getElementById("itinerary-container");
+
+            // 渲染景点推荐
+            data.data.places.forEach(place => {
+                const placeItem = document.createElement("div");
+                placeItem.classList.add("item");
+
+                const placeName = document.createElement("div");
+                placeName.classList.add("item-name");
+                placeName.textContent = place.name;
+
+                const placeDescription = document.createElement("div");
+                placeDescription.classList.add("item-description");
+                placeDescription.textContent = place.description;
+
+                placeItem.appendChild(placeName);
+                placeItem.appendChild(placeDescription);
+
+                placesContainer.appendChild(placeItem);
+            });
+
+            // 渲染美食推荐
+            data.data.food.forEach(food => {
+                const foodItem = document.createElement("div");
+                foodItem.classList.add("item");
+
+                const foodName = document.createElement("div");
+                foodName.classList.add("item-name");
+                foodName.textContent = food.name;
+
+                const foodDescription = document.createElement("div");
+                foodDescription.classList.add("item-description");
+                foodDescription.textContent = food.description;
+
+                foodItem.appendChild(foodName);
+                foodItem.appendChild(foodDescription);
+
+                foodContainer.appendChild(foodItem);
+            });
+
+            // 渲染行程安排
+            data.data.itinerary.forEach(itinerary => {
+                const itineraryItem = document.createElement("div");
+                itineraryItem.classList.add("item");
+
+                const day = document.createElement("div");
+                day.classList.add("item-name");
+                day.textContent = itinerary.day;
+
+                const activities = document.createElement("div");
+                activities.classList.add("item-description");
+                activities.textContent = itinerary.activities.join(", ");
+
+                itineraryItem.appendChild(day);
+                itineraryItem.appendChild(activities);
+
+                itineraryContainer.appendChild(itineraryItem);
+            });
+        })
+        .catch(error => {
+            console.error("Error fetching travel guide data:", error);
+        });
+});
--- a/public/styles.css
+++ b/public/styles.css
@ -0,0 +1,41 @@
+body {
+    font-family: Arial, sans-serif;
+    background-color: #f4f4f9;
+    margin: 0;
+    padding: 0;
+}
+
+.container {
+    max-width: 800px;
+    margin: 20px auto;
+    padding: 20px;
+    background: #fff;
+    border-radius: 8px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+}
+
+h1, h2 {
+    text-align: center;
+    color: #333;
+}
+
+.item {
+    margin-bottom: 20px;
+    padding: 10px;
+    border-bottom: 1px solid #ddd;
+}
+
+.item:last-child {
+    border-bottom: none;
+}
+
+.item-name {
+    font-size: 1.2em;
+    font-weight: bold;
+    color: #444;
+}
+
+.item-description {
+    font-size: 0.9em;
+    color: #666;
+}