大概页面布局完成，api确认没问题，接下来就要上传内容了

.gitignore

@@ -3,3 +3,4 @@
 databases/**
 json/**
 **/static/resources/**
+**/test/**

var/main.py

@@ -37,12 +37,78 @@ async def reload_301():
 async def home(request: Request):
     return templates.TemplateResponse(
         "home.html",
-        {"request": request}
+        {
+            "request": request,
+            "title": "home"
+        }
     )
 
 @app.get("/resources/")
-async def resources(request: Request):
+@app.get("/resources/{name}/")
+async def resources(request: Request, name: str = None):
+    if not  name:
         return templates.TemplateResponse(
-        "resources.html",
+            "resources/home.html",
-        {"request": request}
+            {
+                "request": request,
+                "title": "resources"
+            }
+        )
+    else:
+        return templates.TemplateResponse(
+            "resources/test.html",
+            {
+                "request": request,
+                "name": f"{name}"
+            }
+        )
+
+@app.get("/bbs/")
+async def bbs(request: Request):
+    return templates.TemplateResponse(
+        "bbs.html",
+        {
+            "request": request,
+            "title": "bbs"
+        },
+    )
+
+@app.get("/image/")
+@app.get("/image/{name}/")
+async def image(request: Request, name: str = None):
+    if not name:
+        return templates.TemplateResponse(
+            "image/home.html",
+            {
+                "request": request,
+                "title": "image"
+            }
+        )
+    else:
+        return templates.TemplateResponse(
+            "image/test.html",
+            {
+                "request": request,
+                "name": f"{name}"
+            }
+        )
+    
+@app.get("/video/")
+@app.get("/video/{name}/")
+async def video(request: Request, name: str = None):
+    if not name:
+        return  templates.TemplateResponse(
+            "video/home.html",
+            {
+                "request": request,
+                "title": "video"
+            }
+        )
+    else:
+        return templates.TemplateResponse(
+            "video/test.html",
+            {
+                "request": request,
+                "name": f"{name}"
+            }
         )

var/routers/api.py

@@ -1,5 +1,5 @@
 from fastapi import APIRouter
-import json
+import json, os, datetime
 
 
 root_url = "greendam.ww3.tw"
@@ -16,3 +16,111 @@ def 用于测试():
         "code": "200 ok!",
         "msg": "Hello, World!!"
         }
+
+
+# 根据文件夹列出文件
+###########
+@router.get('/files/list/')
+@router.get('/files/list/{name}/')
+async def 根据文件夹列出文件(name: str = None):
+    if not name:
+        files_path = "../../var/static/resources/greendam"
+        files_name = os.listdir(files_path)
+        files_files = [f for f in files_name if f.lower().endswith((""))]
+        rule_list = []
+        url = f"https://{root_url}/static/resources/greendam"
+        for id, filename in enumerate(files_files, start=1):
+            url_path = f"{url}/{filename}/"
+            rule_list.append({
+                "id": id,
+                "filename": filename,
+                "url_path": url_path
+            })
+        return (rule_list)
+    else:
+        files_path = f"../../var/static/resources/greendam/{name}"
+        files_name = os.listdir(files_path)
+        files_files = [f for f in files_name if f.lower().endswith((""))]
+        rule_list = []
+        url = f"https://{root_url}/static/resources/greendam/{name}"
+        for id, filename in enumerate(files_files, start=1):
+            url_path = f"{url}/{filename}"
+            rule_list.append({
+                "id": id,
+                "filename": filename,
+                "url_path": url_path
+            })
+        return (rule_list)
+###########
+
+# 展示不同版本的小绿图片
+###########
+@router.get("/image/list/")
+@router.get("/image/list/{name}/")
+async def 展示不同版本的小绿图片(name: str = None):
+    if not name:
+        image_path = "../../var/static/resources/other/image"
+        image_name = os.listdir(image_path)
+        image_files = [f for f in image_name if f.lower().endswith((""))]
+        rule_list = []
+        url = f"https://{root_url}/static/resources/other/image"
+        for id, filename in enumerate(image_files, start=1):
+            url_path = f"{url}/{filename}"
+            rule_list.append({
+                "id": id,
+                "filename": filename,
+                "url_path": url_path
+            })
+        return (rule_list)
+    else:
+        image_path = f"../../var/static/resources/other/image/{name}"
+        image_name = os.listdir(image_path)
+        image_files = [f for f in image_name if f.lower().endswith((""))]
+        rule_list = []
+        url = f"https://{root_url}/static/resources/other/image/{name}"
+        for id, filename in enumerate(image_files, start=1):
+            url_path = f"{url}/{filename}"
+            rule_list.append({
+                "id": id,
+                "filename": filename,
+                "url_path": url_path
+            })
+        return  (rule_list)
+
+###########
+
+
+# 展示不同版本的小绿视频合集
+###########
+@router.get("/video/list/")
+@router.get("/video/list/{name}/")
+def 展示不同版本的小绿视频合集(name: str = None):
+    if not name:
+        video_path = "../../var/static/resources/other/video"
+        video_name = os.listdir(video_path)
+        video_files = [f for f in video_name if f.lower().endswith((""))]
+        rule_list = []
+        url = f"https://{root_url}/static/resources/other/video"
+        for id, filename in enumerate(video_files, start=1):
+            url_path = f"{url}/{filename}"
+            rule_list.append({
+                "id": id,
+                "filename": filename,
+                "url_path": url_path
+            })
+        return (rule_list)
+    else:
+        video_path = f"../../var/static/resources/other/video/{name}"
+        video_name = os.listdir(video_path)
+        video_files = [f for f in video_name if f.lower().endswith((""))]
+        rule_list = []
+        url = f"https://{root_url}/static/resources/other/video/{name}"
+        for id,filename in enumerate(video_files, start=1):
+            url_path = f"{url}/{filename}"
+            rule_list.append({
+                "id": id,
+                "filename": filename,
+                "url_path": url_path
+            })
+        return (rule_list)
+###########

var/templates/bbs.html

@@ -0,0 +1,11 @@
+<html>
+    <head>
+        <title>绿坝娘资源小站 (仮) | {{ title }}</title>
+        <link rel="icon" type="image/png" sizes="128x128" href="/static/src/img/logo.png">
+    </head>
+    <body>
+        <a href="/">返回主页</a>
+        <br>
+        搭建中......
+    </body>
+</html>

var/templates/home.html

@@ -1,6 +1,6 @@
 <html>
 	<head>
-		<title>绿坝娘资源小站 (仮) | home</title>
+		<title>绿坝娘资源小站 (仮) | {{ title }}</title>
 		<link rel="stylesheet" href="/static/src/css/home/main.css">
 		<link rel="icon" type="image/png" sizes="128x128" href="/static/src/img/logo.png">
 	</head>
@@ -35,10 +35,10 @@
 			<br>
 			<br>
 			<br>
-			<li style="font-size: 600%; width: 65%; height: 25%; text-align: right;">
+			<li style="font-size: 600%; width: 65%; height: 25%; text-align: right; list-style: none;">
-			<a href="#">主页</a>
+			<a href="/">主页</a>
 			<a href="/resources/">资源</a>
-			<a href="#">论坛</a>
+			<a href="/bbs/">论坛</a>
 			</li>
 			<br>
 			<br>
@@ -46,6 +46,8 @@
 			<br>
 			目前firefox是有问题的，但是我个人并不在windows使用firefox，故而不考虑适配
 			<br>
+			还差一个图片导览暂，做好之后再重定向
+			<br>
 			<br>
 			随机绿坝娘网站
 			<br>

var/templates/image/home.html

@@ -0,0 +1,22 @@
+<html>
+    <head>
+        <title>选择不同版本的小绿</title>
+    </head>
+    <body>
+        <h2>选择不同版本的小绿<a href="/image">__>重新刷新</h2>
+        <div id="list"></div>
+    </body>
+</html>
+    <script>
+        fetch('https://greendam.ww3.tw/api/image/list/')
+        .then(res => res.json())
+        .then(data => {
+            data.forEach(item => {
+                console.log('ID', item.id);
+                console.log('Name', item.filename);
+                console.log('URL', item.url_path);
+
+                document.getElementById('list').innerHTML += `<a href="/image/${item.filename}"><b>${item.filename}</b></a>___`
+            })
+        })
+    </script>

var/templates/image/test.html

@@ -0,0 +1,24 @@
+<html>
+    <head>
+        <title>{{ name }}</title>
+    </head>
+    <body>
+        <h2>图片预览_{{ name }}<a href="../">返回上级../</a></h2>
+        <div id="content"></div>
+    </body>
+    <script>
+        fetch('https://greendam.ww3.tw/api/image/list/{{ name }}/')
+        .then(res => res.json())
+        .then(data => {
+            data.forEach(item => {
+                console.log("ID", item.id)
+                console.log("Name", item.filename)
+                console.log("Url", item.url_path)
+
+                let content_Document = `<img src="${item.url_path}" alt="${item.filename}"  style="width: 10%;" loading="lazy">${item.id}`
+                document.getElementById('content').innerHTML += content_Document
+            })
+        })
+    </script>
+    
+</html>

var/templates/resources.html

@@ -1 +0,0 @@
-123

var/templates/resources/home.html

@@ -0,0 +1,34 @@
+<html>
+    <head>
+        <title>绿坝娘资源小站 (仮) | {{ title }}</title>
+        <link rel="icon" type="image/png" sizes="128x128" href="/static/src/img/logo.png">
+    </head>
+    <body>
+        <a href="/">返回主页</a>
+        <br>
+        <h1>Index of /</h1>
+        <hr>
+        <div id="content">
+        </div>
+        <hr>
+        <br>
+        以下还可以预览小绿的图片（本来想做预览图的，结果能力有限，现在正在努力学习javascript）
+        <br>
+        <a href="/image">图片导览</a>_<a href="/video">视频导览</a>
+    </body>
+</html>
+
+<script>
+    fetch("https://greendam.ww3.tw/api/files/list/")
+    .then(res => res.json())
+    	.then (data => {
+		data.forEach(item => {
+			console.log('ID', item.id);
+			console.log('Name', item.filename);
+			console.log('URL', item.url_path);
+
+            let contentDocment = `<a href="https://greendam.ww3.tw/resources/${item.filename}">${item.filename}</a><br>`
+            document.getElementById("content").innerHTML += contentDocment
+		})
+	})
+</script>

var/templates/resources/test.html

@@ -0,0 +1,30 @@
+<html>
+    <head>
+        <title>绿坝娘资源小站 (仮) | {{ name }}</title>
+        <link rel="icon" type="image/png" sizes="128x128" href="/static/src/img/logo.png">
+    </head>
+    <body>
+        <a href="/resources">返回上级</a>
+        <br>
+        <h1>Index of /{{ name }}</h1>
+        <hr>
+        <div id="content">
+        </div>
+        <hr>
+    </body>
+</html>
+
+<script>
+    fetch("https://greendam.ww3.tw/api/files/list/{{ name }}/")
+    .then(res => res.json())
+    	.then (data => {
+		data.forEach(item => {
+			console.log('ID', item.id);
+			console.log('Name', item.filename);
+			console.log('URL', item.url_path);
+
+            let contentDocment = `<a href="${item.url_path}">${item.filename}</a><br>`
+            document.getElementById("content").innerHTML += contentDocment
+		})
+	})
+</script>

var/templates/video/home.html

@@ -0,0 +1,25 @@
+<html>
+    <head>
+        <title>绿坝娘资源小站 (仮) | {{ title }}</title>
+        <link rel="icon" type="image/png" sizes="128x128" href="/static/src/img/logo.png">
+    </head>
+    <body>
+        <h2>视频导览<a href="/resources">../返回上级</a></h2>
+        <br>
+        <div id="list"></div>
+    </body>
+    <script>
+        fetch('https://greendam.ww3.tw/api/video/list/')
+        .then(res => res.json())
+        .then(data => {
+            data.forEach(item => {
+                console.log("ID", item.id)
+                console.log("Name", item.filename)
+                console.log("Url", item.url_path)
+
+                let list_Document = `<a href="./${item.filename}">${item.filename}</a>__`
+                document.getElementById('list').innerHTML += list_Document
+            })
+        })
+    </script>
+</html>

var/templates/video/test.html

@@ -0,0 +1,24 @@
+<html>
+    <head>
+        <title>绿坝娘资源小站 (仮) | {{ name }}</title>
+        <link rel="icon" type="image/png" sizes="128x128" href="/static/src/img/logo.png">
+    </head>
+    <body>
+        {{ name }}
+        <div id="content"></div>
+    </body>
+    <script>
+        fetch('https://greendam.ww3.tw/api/video/list/{{ name }}/')
+        .then(res => res.json())
+        .then(data => {
+            data.forEach(itme => {
+                console.log("ID", itme.id)
+                console.log("Name", itme.filename)
+                console.log("Url", itme.url_path)
+
+                let video_Document = `<br><br><b>${itme.filename}</b><br><br><hr><video width="25%" controls><source src=${itme.url_path} type="video/mp4"></video><br>`
+                document.getElementById('content').innerHTML += video_Document
+            })
+        })
+    </script>
+</html>