commit
485e54b06b
4 changed files with 119 additions and 0 deletions
@ -0,0 +1,33 @@ |
|||||
|
from flask import Flask, jsonify |
||||
|
|
||||
|
app = Flask(__name__, static_folder="public", static_url_path="") |
||||
|
|
||||
|
# WPS表格处理知识点数据 |
||||
|
wps_table_data = { |
||||
|
"introduction": "WPS表格是一款功能强大的电子表格软件，适用于数据分析和报告。", |
||||
|
"functions": [ |
||||
|
"数据排序：快速对数据进行升序或降序排列。", |
||||
|
"数据筛选：根据特定条件筛选数据。", |
||||
|
"公式计算：支持多种数学和统计公式。", |
||||
|
"图表制作：轻松创建各种图表，如柱状图、饼图等。", |
||||
|
"数据透视表：对大量数据进行快速汇总和分析。" |
||||
|
], |
||||
|
"tips": [ |
||||
|
"使用快捷键可以提高工作效率。", |
||||
|
"定期保存工作，避免数据丢失。", |
||||
|
"利用模板可以快速创建表格。" |
||||
|
] |
||||
|
} |
||||
|
|
||||
|
# 根路径返回 index.html |
||||
|
@app.route("/") |
||||
|
def serve_index(): |
||||
|
return app.send_static_file("index.html") |
||||
|
|
||||
|
# API 子路径，提供WPS表格处理知识点数据 |
||||
|
@app.route("/api/wps-table") |
||||
|
def api_wps_table(): |
||||
|
return jsonify(wps_table_data) |
||||
|
|
||||
|
if __name__ == "__main__": |
||||
|
app.run(debug=True, port=81) |
||||
@ -0,0 +1,29 @@ |
|||||
|
<!DOCTYPE html> |
||||
|
<html lang="en"> |
||||
|
<head> |
||||
|
<meta charset="UTF-8"> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||
|
<title>WPS Table Knowledge</title> |
||||
|
<link rel="stylesheet" href="style.css"> |
||||
|
</head> |
||||
|
<body> |
||||
|
<header> |
||||
|
<h1>WPS Table Knowledge</h1> |
||||
|
</header> |
||||
|
<main> |
||||
|
<section id="introduction"> |
||||
|
<h2>Introduction</h2> |
||||
|
<p id="intro-text"></p> |
||||
|
</section> |
||||
|
<section id="functions"> |
||||
|
<h2>Functions</h2> |
||||
|
<ul id="functions-list"></ul> |
||||
|
</section> |
||||
|
<section id="tips"> |
||||
|
<h2>Tips</h2> |
||||
|
<ul id="tips-list"></ul> |
||||
|
</section> |
||||
|
</main> |
||||
|
<script src="script.js"></script> |
||||
|
</body> |
||||
|
</html> |
||||
@ -0,0 +1,20 @@ |
|||||
|
document.addEventListener('DOMContentLoaded', function() { |
||||
|
fetch('/api/wps-table') |
||||
|
.then(response => response.json()) |
||||
|
.then(data => { |
||||
|
document.getElementById('intro-text').textContent = data.introduction; |
||||
|
const functionsList = document.getElementById('functions-list'); |
||||
|
data.functions.forEach(functionItem => { |
||||
|
const li = document.createElement('li'); |
||||
|
li.textContent = functionItem; |
||||
|
functionsList.appendChild(li); |
||||
|
}); |
||||
|
const tipsList = document.getElementById('tips-list'); |
||||
|
data.tips.forEach(tip => { |
||||
|
const li = document.createElement('li'); |
||||
|
li.textContent = tip; |
||||
|
tipsList.appendChild(li); |
||||
|
}); |
||||
|
}) |
||||
|
.catch(error => console.error('Error fetching data:', error)); |
||||
|
}); |
||||
@ -0,0 +1,37 @@ |
|||||
|
body { |
||||
|
font-family: Arial, sans-serif; |
||||
|
background-color: #f0f0f0; |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
header { |
||||
|
background-color: #333; |
||||
|
color: white; |
||||
|
padding: 10px 0; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
main { |
||||
|
padding: 20px; |
||||
|
background-color: white; |
||||
|
margin: 20px; |
||||
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
||||
|
} |
||||
|
|
||||
|
h1, h2 { |
||||
|
color: #333; |
||||
|
} |
||||
|
|
||||
|
section { |
||||
|
margin-bottom: 20px; |
||||
|
} |
||||
|
|
||||
|
ul { |
||||
|
list-style-type: none; |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
li { |
||||
|
margin: 5px 0; |
||||
|
} |
||||
Loading…
Reference in new issue