first commit

1 month ago · 08d7734488
4 changed files with 145 additions and 0 deletions
--- a/app.py
+++ b/app.py
@ -0,0 +1,35 @@
+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 子路径，提供 WPS 表格处理知识点复习资料
+@app.route("/api/wps-review")
+def api_wps_review():
+    wps_review_data = {
+        "message": "WPS 表格处理知识点复习资料",
+        "data": {
+            "introduction": "WPS 表格是计算机二级考试的重要内容，掌握基本操作和高级技巧是关键。",
+            "key_topics": [
+                {"topic": "基础操作", "content": "创建和保存表格、输入数据、调整行高列宽、格式化单元格。"},
+                {"topic": "公式与函数", "content": "SUM、AVERAGE、MAX、MIN 等常用函数的使用，相对引用与绝对引用。"},
+                {"topic": "数据排序与筛选", "content": "升序、降序排序，自动筛选和高级筛选的使用。"},
+                {"topic": "数据透视表", "content": "创建数据透视表，进行数据汇总与分析。"},
+                {"topic": "图表制作", "content": "柱状图、折线图、饼图的创建与美化。"}
+            ],
+            "tips": [
+                "多练习实际操作，熟悉快捷键。",
+                "理解公式和函数的逻辑，多用实例练习。",
+                "掌握数据透视表的创建和应用，这是高频考点。",
+                "图表制作要注重细节，确保美观且准确。"
+            ]
+        }
+    }
+    return jsonify(wps_review_data)
+
+if __name__ == "__main__":
+    app.run(debug=True,host="0.0.0.0", 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>计算机二级 WPS 表格处理复习资料</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div class="container">
+        <h1>计算机二级 WPS 表格处理复习资料</h1>
+        <p id="introduction"></p>
+        <div class="section">
+            <h2>核心知识点</h2>
+            <div id="key-topics-container"></div>
+        </div>
+        <div class="section">
+            <h2>复习小贴士</h2>
+            <div id="tips-container"></div>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
--- a/public/script.js
+++ b/public/script.js
@ -0,0 +1,41 @@
+document.addEventListener("DOMContentLoaded", function () {
+    fetch("/api/wps-review")
+        .then(response => response.json())
+        .then(data => {
+            const introduction = document.getElementById("introduction");
+            introduction.textContent = data.data.introduction;
+
+            const keyTopicsContainer = document.getElementById("key-topics-container");
+            const tipsContainer = document.getElementById("tips-container");
+
+            // 渲染核心知识点
+            data.data.key_topics.forEach(topic => {
+                const topicItem = document.createElement("div");
+                topicItem.classList.add("item");
+
+                const topicName = document.createElement("div");
+                topicName.classList.add("item-name");
+                topicName.textContent = topic.topic;
+
+                const topicContent = document.createElement("div");
+                topicContent.classList.add("item-description");
+                topicContent.textContent = topic.content;
+
+                topicItem.appendChild(topicName);
+                topicItem.appendChild(topicContent);
+
+                keyTopicsContainer.appendChild(topicItem);
+            });
+
+            // 渲染复习小贴士
+            data.data.tips.forEach(tip => {
+                const tipItem = document.createElement("div");
+                tipItem.classList.add("item");
+                tipItem.textContent = tip;
+                tipsContainer.appendChild(tipItem);
+            });
+        })
+        .catch(error => {
+            console.error("Error fetching review data:", error);
+        });
+});
--- a/public/styles.css
+++ b/public/styles.css
@ -0,0 +1,45 @@
+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;
+}
+
+.section {
+    margin-top: 20px;
+}
+
+.item {
+    margin-bottom: 15px;
+    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;
+}