commit
fffe024498
4 changed files with 179 additions and 0 deletions
@ -0,0 +1,94 @@ |
|||
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 子路径,提供 Linux 基本语法知识点数据 |
|||
@app.route("/api/linux-tips") |
|||
def linux_tips(): |
|||
tips = { |
|||
"message": "欢迎来到 Linux 基本语法知识点", |
|||
"tips": [ |
|||
{ |
|||
"title": "查看当前目录", |
|||
"command": "pwd", |
|||
"description": "显示当前工作目录的完整路径。" |
|||
}, |
|||
{ |
|||
"title": "列出目录内容", |
|||
"command": "ls", |
|||
"description": "列出当前目录或指定目录中的文件和文件夹。" |
|||
}, |
|||
{ |
|||
"title": "切换目录", |
|||
"command": "cd", |
|||
"description": "切换到指定的目录。例如:`cd /path/to/directory`。" |
|||
}, |
|||
{ |
|||
"title": "创建目录", |
|||
"command": "mkdir", |
|||
"description": "创建一个新的目录。例如:`mkdir new_folder`。" |
|||
}, |
|||
{ |
|||
"title": "删除文件或目录", |
|||
"command": "rm", |
|||
"description": "删除文件或目录。例如:`rm file.txt` 或 `rm -r folder`(递归删除目录)。" |
|||
}, |
|||
{ |
|||
"title": "复制文件或目录", |
|||
"command": "cp", |
|||
"description": "复制文件或目录。例如:`cp source.txt destination.txt` 或 `cp -r source_folder destination_folder`。" |
|||
}, |
|||
{ |
|||
"title": "移动或重命名文件", |
|||
"command": "mv", |
|||
"description": "移动文件或目录,也可以用于重命名。例如:`mv file.txt new_name.txt`。" |
|||
}, |
|||
{ |
|||
"title": "查看文件内容", |
|||
"command": "cat", |
|||
"description": "显示文件的内容。例如:`cat file.txt`。" |
|||
}, |
|||
{ |
|||
"title": "分页查看文件内容", |
|||
"command": "more/less", |
|||
"description": "逐页显示文件内容,`less` 支持上下翻页。例如:`less file.txt`。" |
|||
}, |
|||
{ |
|||
"title": "查找文件", |
|||
"command": "find", |
|||
"description": "在指定目录下查找文件。例如:`find /path -name filename`。" |
|||
}, |
|||
{ |
|||
"title": "查看进程", |
|||
"command": "ps", |
|||
"description": "显示当前进程的状态。例如:`ps aux`。" |
|||
}, |
|||
{ |
|||
"title": "终止进程", |
|||
"command": "kill", |
|||
"description": "终止指定的进程。例如:`kill PID`。" |
|||
}, |
|||
{ |
|||
"title": "查看磁盘使用情况", |
|||
"command": "df", |
|||
"description": "显示磁盘的使用情况。例如:`df -h`。" |
|||
}, |
|||
{ |
|||
"title": "查看文件系统挂载情况", |
|||
"command": "mount", |
|||
"description": "显示已挂载的文件系统。" |
|||
} |
|||
] |
|||
} |
|||
return jsonify(tips) |
|||
|
|||
|
|||
if __name__ == "__main__": |
|||
app.run(debug=True, port=80) |
@ -0,0 +1,19 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="zh-CN"> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|||
<title>Linux 基本语法知识点</title> |
|||
<link rel="stylesheet" href="styles.css"> |
|||
</head> |
|||
<body> |
|||
<div class="container"> |
|||
<h1>Linux 基本语法知识点</h1> |
|||
<div id="tips-container"> |
|||
<h2>常用命令及说明</h2> |
|||
<div id="tips-list"></div> |
|||
</div> |
|||
</div> |
|||
<script src="script.js"></script> |
|||
</body> |
|||
</html> |
@ -0,0 +1,24 @@ |
|||
document.addEventListener("DOMContentLoaded", () => { |
|||
fetch("/api/linux-tips") |
|||
.then(response => response.json()) |
|||
.then(data => { |
|||
const tipsList = document.getElementById("tips-list"); |
|||
data.tips.forEach(tip => { |
|||
const tipDiv = document.createElement("div"); |
|||
tipDiv.classList.add("tip"); |
|||
|
|||
const tipTitle = document.createElement("h3"); |
|||
tipTitle.textContent = `${tip.title} (${tip.command})`; |
|||
tipDiv.appendChild(tipTitle); |
|||
|
|||
const tipDescription = document.createElement("p"); |
|||
tipDescription.textContent = tip.description; |
|||
tipDiv.appendChild(tipDescription); |
|||
|
|||
tipsList.appendChild(tipDiv); |
|||
}); |
|||
}) |
|||
.catch(error => { |
|||
console.error("获取数据时出错:", 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; |
|||
} |
|||
|
|||
#tips-list { |
|||
margin-top: 20px; |
|||
} |
|||
|
|||
.tip { |
|||
background: #e9f2ff; |
|||
padding: 10px; |
|||
margin-bottom: 10px; |
|||
border-radius: 5px; |
|||
} |
|||
|
|||
.tip h3 { |
|||
margin: 0 0 5px; |
|||
color: #007bff; |
|||
} |
|||
|
|||
.tip p { |
|||
margin: 0; |
|||
font-size: 14px; |
|||
color: #555; |
|||
} |
Loading…
Reference in new issue