From 08d77344880870c30494a9e5e9c0533f0bd481b8 Mon Sep 17 00:00:00 2001 From: jc <419690370@qq.com> Date: Sun, 16 Mar 2025 16:51:07 +0800 Subject: [PATCH] first commit --- app.py | 35 +++++++++++++++++++++++++++++++++++ public/index.html | 24 ++++++++++++++++++++++++ public/script.js | 41 +++++++++++++++++++++++++++++++++++++++++ public/styles.css | 45 +++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 145 insertions(+) create mode 100644 app.py create mode 100644 public/index.html create mode 100644 public/script.js create mode 100644 public/styles.css diff --git a/app.py b/app.py new file mode 100644 index 0000000..b0e41be --- /dev/null +++ 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) \ No newline at end of file diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..1b71bb6 --- /dev/null +++ b/public/index.html @@ -0,0 +1,24 @@ + + + + + + 计算机二级 WPS 表格处理复习资料 + + + +
+

计算机二级 WPS 表格处理复习资料

+

+
+

核心知识点

+
+
+
+

复习小贴士

+
+
+
+ + + \ No newline at end of file diff --git a/public/script.js b/public/script.js new file mode 100644 index 0000000..e923fed --- /dev/null +++ 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); + }); +}); \ No newline at end of file diff --git a/public/styles.css b/public/styles.css new file mode 100644 index 0000000..a894304 --- /dev/null +++ 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; +} \ No newline at end of file