From a302c2e836ba459a38c00e708b9892d2558934b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B0=A2=E4=BA=9A=E6=98=95?= <1549469775@qq.com>
Date: Mon, 7 Jul 2025 17:10:04 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=87=8D=E6=9E=84=E6=97=B6=E9=97=B4?=
 =?UTF-8?q?=E7=BA=BF=E7=BB=84=E4=BB=B6=EF=BC=8C=E4=BC=98=E5=8C=96=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E6=B8=B2=E6=9F=93=E9=80=BB=E8=BE=91=EF=BC=8C=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E6=9C=AA=E6=8E=88=E6=9D=83=E9=A1=B5=E9=9D=A2=E8=B7=B3?=
 =?UTF-8?q?=E8=BD=AC=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/css/page/index.css              | 131 ------------------------
 src/controllers/Page/PageController.js |  15 +--
 src/middlewares/Views/index.js         |   2 +-
 src/utils/router/RouteAuth.js          |   2 +-
 src/views/htmx/timeline.pug            | 178 +++++++++++++++++++++++++++++++++
 src/views/layouts/pure.pug             |   1 -
 src/views/page/auth/no-auth.pug        |   7 +-
 src/views/page/index/index.pug         |  42 +-------
 src/views/page/index/person.pug        |   9 ++
 9 files changed, 206 insertions(+), 181 deletions(-)
 create mode 100644 src/views/htmx/timeline.pug
 create mode 100644 src/views/page/index/person.pug

diff --git a/public/css/page/index.css b/public/css/page/index.css
index 7597681..7498e1e 100644
--- a/public/css/page/index.css
+++ b/public/css/page/index.css
@@ -45,137 +45,6 @@
     text-align: center;
 }
 
-.time-line {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    position: relative;
-}
-
-.time-line:before {
-    content: "";
-    width: 3px;
-    height: 100%;
-    background: rgba(255, 255, 255, 0.37);
-    backdrop-filter: blur(12px);
-    left: 50%;
-    top: 0;
-    position: absolute;
-    transform: translateX(-50%);
-}
-
-.time-line::after {
-    content: "";
-    position: absolute;
-    left: 50%;
-    top: 100%;
-    width: 0;
-    height: 0;
-    border-top: 12px solid rgba(255, 255, 255, 0.37);
-    border-right: 7px solid transparent;
-    border-left: 7px solid transparent;
-    backdrop-filter: blur(12px);
-    transform: translateX(-50%);
-}
-
-.time-line a {
-    color: rgb(219, 255, 121);
-    text-decoration: underline;
-    font-weight: 600;
-    transition: color 0.2s, background 0.2s;
-    border-radius: 8px;
-    padding: 1px 4px;
-}
-.time-line a:hover {
-    color: #fff;
-    background: linear-gradient(90deg, #7ec6f7 0%, #ff8ca8 100%);
-    text-decoration: none;
-}
-
-.time-line-item {
-    color: white;
-    width: 900px;
-    margin: 20px auto;
-    position: relative;
-}
-
-.time-line-item:first-child {
-    margin-top: 0;
-}
-
-.time-line-item:last-child {
-    margin-bottom: 50px;
-}
-
-.timeline-icon {
-    position: absolute;
-    width: 100px;
-    height: 50px;
-    background-color: #ee4d4d7a;
-    backdrop-filter: blur(12px);
-    left: 50%;
-    top: 0;
-    transform: translateX(-50%);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-family: Arial, Helvetica, sans-serif;
-}
-
-.time-line-item-title {
-    background-color: #ee4d4d7a;
-    backdrop-filter: blur(12px);
-    height: 50px;
-    line-height: 50px;
-    padding: 0 20px;
-}
-
-.time-line-item:nth-child(odd) .time-line-item-content {
-    color: white;
-    width: 50%;
-    padding-right: 80px;
-}
-
-.time-line-item:nth-child(odd) .time-line-item-content::before {
-    content: "";
-    position: absolute;
-    left: calc(50% - 80px);
-    top: 20px;
-    width: 0;
-    height: 0;
-    border-top: 7px solid transparent;
-    border-bottom: 7px solid transparent;
-    border-left: 7px solid #ee4d4d7a;
-    backdrop-filter: blur(12px);
-}
-
-.time-line-item:nth-child(even) .time-line-item-content {
-    float: right;
-    width: 50%;
-    padding-left: 80px;
-}
-
-.time-line-item:nth-child(even) .time-line-item-content::before {
-    content: "";
-    position: absolute;
-    right: calc(50% - 80px);
-    top: 20px;
-    width: 0;
-    height: 0;
-    border-top: 7px solid transparent;
-    border-bottom: 7px solid transparent;
-    border-right: 7px solid #ee4d4d7a;
-    backdrop-filter: blur(12px);
-}
-
-.time-line-item-desc {
-    background-color: #ffffff54;
-    backdrop-filter: blur(12px);
-    color: #fff;
-    padding: 20px;
-    line-height: 1.4;
-}
-
 @media screen and (max-width: 768px) {
     .home-hero {
         margin: 0;
diff --git a/src/controllers/Page/PageController.js b/src/controllers/Page/PageController.js
index c4a702d..5113454 100644
--- a/src/controllers/Page/PageController.js
+++ b/src/controllers/Page/PageController.js
@@ -8,10 +8,10 @@ class PageController {
         this.siteConfigService = new SiteConfigService()
     }
     async indexGet(ctx) {
-        const user = ctx.state.user
-        return await ctx.render("page/index/index", {
-            user: user,
-        }, { includeSite: true })
+        return await ctx.render("page/index/index", {}, { includeSite: true, includeUser: true })
+    }
+    async indexNoAuth(ctx) {
+        return await ctx.render("page/auth/no-auth", {})
     }
 
     async loginPost(ctx) {
@@ -39,9 +39,10 @@ class PageController {
     static createRoutes() {
         const controller = new PageController()
         const router = new Router({ auth: "try" })
-        router.get("/", controller.indexGet.bind(controller))
-
-        router.get("/no-auth", controller.pageGet("page/auth/no-auth"), { auth: false })
+        // 首页
+        router.get("/", controller.indexGet.bind(controller), { auth: false  })
+        // 未授权报错页
+        router.get("/no-auth", controller.indexNoAuth.bind(controller), { auth: false })
 
         router.get("/article/:id", controller.pageGet("page/articles/index"), { auth: false })
         router.get("/articles", controller.pageGet("page/articles/index"), { auth: false })
diff --git a/src/middlewares/Views/index.js b/src/middlewares/Views/index.js
index ccdcdc1..4c69db1 100644
--- a/src/middlewares/Views/index.js
+++ b/src/middlewares/Views/index.js
@@ -18,7 +18,7 @@ function viewsMiddleware(path, { engineSource = consolidate, extension = "html",
 
         // 将 render 注入到 context 和 response 对象中
         ctx.response.render = ctx.render = function (relPath, locals = {}, renderOptions) {
-            renderOptions = assign({ includeSite: false, includeUser: false }, renderOptions || {})
+            renderOptions = assign({ includeSite: true, includeUser: false }, renderOptions || {})
             return getPaths(path, relPath, extension).then(async paths => {
                 const suffix = paths.ext
                 const site = await siteConfigService.getAll()
diff --git a/src/utils/router/RouteAuth.js b/src/utils/router/RouteAuth.js
index 3d11490..d1a4e83 100644
--- a/src/utils/router/RouteAuth.js
+++ b/src/utils/router/RouteAuth.js
@@ -28,7 +28,7 @@ export default function RouteAuth(options = {}) {
         if (auth === true) {
             if (!ctx.state.user) {
                 if (ctx.accepts('html')) {
-                    ctx.redirect('/no-auth')
+                    ctx.redirect('/no-auth?from=' + ctx.request.url)
                     return
                 }
                 ctx.status = 401
diff --git a/src/views/htmx/timeline.pug b/src/views/htmx/timeline.pug
new file mode 100644
index 0000000..4766f11
--- /dev/null
+++ b/src/views/htmx/timeline.pug
@@ -0,0 +1,178 @@
+- var _dataList = timeLine || [] 
+ul.time-line
+    each item in _dataList
+        li.time-line-item 
+            .timeline-icon 
+                div #{item.icon}
+            .time-line-item-content
+                .time-line-item-title #{item.title}
+                .time-line-item-desc #{item.desc}
+    li.time-line-item 
+      .timeline-icon 
+        div 第一份工作
+      .time-line-item-content
+        .time-line-item-title ？？？
+        .time-line-item-desc 做游戏的。
+    li.time-line-item
+      .timeline-icon 
+        div 大学毕业
+      .time-line-item-content
+        .time-line-item-title 2014年09月
+        .time-line-item-desc 我从 
+          a(href="https://www.jxnu.edu.cn/" target="_blank") 江西师范大学 
+          span 毕业，获得了软件工程（虚拟现实与技术）专业的学士学位。
+    li.time-line-item
+      .timeline-icon 
+        div 高中
+      .time-line-item-content
+        .time-line-item-title ？？？
+        .time-line-item-desc 宜春中学
+    li.time-line-item
+      .timeline-icon 
+        div 初中
+      .time-line-item-content
+        .time-line-item-title ？？？
+        .time-line-item-desc 宜春实验中学
+    li.time-line-item
+      .timeline-icon 
+        div 小学
+      .time-line-item-content
+        .time-line-item-title ？？？
+        .time-line-item-desc 宜春二小
+    li.time-line-item
+          .timeline-icon 
+            div 出生
+          .time-line-item-content
+            .time-line-item-title 1996年06月
+            .time-line-item-desc 我出生于江西省丰城市泉港镇。
+    style.
+        .time-line {
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            position: relative;
+        }
+
+        .time-line:before {
+            content: "";
+            width: 3px;
+            height: 100%;
+            background: rgba(255, 255, 255, 0.37);
+            backdrop-filter: blur(12px);
+            left: 50%;
+            top: 0;
+            position: absolute;
+            transform: translateX(-50%);
+        }
+
+        .time-line::after {
+            content: "";
+            position: absolute;
+            left: 50%;
+            top: 100%;
+            width: 0;
+            height: 0;
+            border-top: 12px solid rgba(255, 255, 255, 0.37);
+            border-right: 7px solid transparent;
+            border-left: 7px solid transparent;
+            backdrop-filter: blur(12px);
+            transform: translateX(-50%);
+        }
+
+        .time-line a {
+            color: rgb(219, 255, 121);
+            text-decoration: underline;
+            font-weight: 600;
+            transition: color 0.2s, background 0.2s;
+            border-radius: 8px;
+            padding: 1px 4px;
+        }
+        .time-line a:hover {
+            color: #fff;
+            background: linear-gradient(90deg, #7ec6f7 0%, #ff8ca8 100%);
+            text-decoration: none;
+        }
+
+        .time-line-item {
+            color: white;
+            width: 900px;
+            margin: 20px auto;
+            position: relative;
+        }
+
+        .time-line-item:first-child {
+            margin-top: 0;
+        }
+
+        .time-line-item:last-child {
+            margin-bottom: 50px;
+        }
+
+        .timeline-icon {
+            position: absolute;
+            width: 100px;
+            height: 50px;
+            background-color: #ee4d4d7a;
+            backdrop-filter: blur(12px);
+            left: 50%;
+            top: 0;
+            transform: translateX(-50%);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-family: Arial, Helvetica, sans-serif;
+        }
+
+        .time-line-item-title {
+            background-color: #ee4d4d7a;
+            backdrop-filter: blur(12px);
+            height: 50px;
+            line-height: 50px;
+            padding: 0 20px;
+        }
+
+        .time-line-item:nth-child(odd) .time-line-item-content {
+            color: white;
+            width: 50%;
+            padding-right: 80px;
+        }
+
+        .time-line-item:nth-child(odd) .time-line-item-content::before {
+            content: "";
+            position: absolute;
+            left: calc(50% - 80px);
+            top: 20px;
+            width: 0;
+            height: 0;
+            border-top: 7px solid transparent;
+            border-bottom: 7px solid transparent;
+            border-left: 7px solid #ee4d4d7a;
+            backdrop-filter: blur(12px);
+        }
+
+        .time-line-item:nth-child(even) .time-line-item-content {
+            float: right;
+            width: 50%;
+            padding-left: 80px;
+        }
+
+        .time-line-item:nth-child(even) .time-line-item-content::before {
+            content: "";
+            position: absolute;
+            right: calc(50% - 80px);
+            top: 20px;
+            width: 0;
+            height: 0;
+            border-top: 7px solid transparent;
+            border-bottom: 7px solid transparent;
+            border-right: 7px solid #ee4d4d7a;
+            backdrop-filter: blur(12px);
+        }
+
+        .time-line-item-desc {
+            background-color: #ffffff54;
+            backdrop-filter: blur(12px);
+            color: #fff;
+            padding: 20px;
+            line-height: 1.4;
+        }
\ No newline at end of file
diff --git a/src/views/layouts/pure.pug b/src/views/layouts/pure.pug
index bb0665a..65bc51d 100644
--- a/src/views/layouts/pure.pug
+++ b/src/views/layouts/pure.pug
@@ -5,7 +5,6 @@ block head
   block pageHead
 
 block content
-  // 页面整体flex布局，footer吸底
   .page-layout
     .page
       .content 
diff --git a/src/views/page/auth/no-auth.pug b/src/views/page/auth/no-auth.pug
index b046585..2a952ba 100644
--- a/src/views/page/auth/no-auth.pug
+++ b/src/views/page/auth/no-auth.pug
@@ -46,4 +46,9 @@ block pageHead
     .no-auth-container .btn:hover {
       background: linear-gradient(90deg, #ffb86c 0%, #4fd1ff 100%);
       color: #fff200;
-    }
\ No newline at end of file
+    }
+
+block pageScripts 
+  script.
+    const curUrl = URL.parse(location.href).searchParams.get("from")
+    fetch(curUrl,{redirect: 'error'}).then(res=>location.href=curUrl).catch(e=>console.log(e))
\ No newline at end of file
diff --git a/src/views/page/index/index.pug b/src/views/page/index/index.pug
index 4e68df8..8b5ff59 100644
--- a/src/views/page/index/index.pug
+++ b/src/views/page/index/index.pug
@@ -10,42 +10,6 @@ block pageContent
       img.avatar(src="https://alist.xieyaxin.top/p/%E6%B8%B8%E5%AE%A2%E6%96%87%E4%BB%B6/%E5%85%AC%E5%85%B1%E4%BF%A1%E6%81%AF/avatar.jpg", alt="")
   .card 
     div 人生轨迹
-  ul.time-line
-    li.time-line-item 
-      .timeline-icon 
-        div 第一份工作
-      .time-line-item-content
-        .time-line-item-title ？？？
-        .time-line-item-desc 做游戏的。
-    li.time-line-item
-      .timeline-icon 
-        div 大学毕业
-      .time-line-item-content
-        .time-line-item-title 2014年09月
-        .time-line-item-desc 我从 
-          a(href="https://www.jxnu.edu.cn/" target="_blank") 江西师范大学 
-          span 毕业，获得了软件工程（虚拟现实与技术）专业的学士学位。
-    li.time-line-item
-      .timeline-icon 
-        div 高中
-      .time-line-item-content
-        .time-line-item-title ？？？
-        .time-line-item-desc 宜春中学
-    li.time-line-item
-      .timeline-icon 
-        div 初中
-      .time-line-item-content
-        .time-line-item-title ？？？
-        .time-line-item-desc 宜春实验中学
-    li.time-line-item
-      .timeline-icon 
-        div 小学
-      .time-line-item-content
-        .time-line-item-title ？？？
-        .time-line-item-desc 宜春二小
-    li.time-line-item
-          .timeline-icon 
-            div 出生
-          .time-line-item-content
-            .time-line-item-title 1996年06月
-            .time-line-item-desc 我出生于江西省丰城市泉港镇。
+  +include()
+      - let timeLine = [{icon: '11',title: "aaaa",desc:"asd"}]
+      include /htmx/timeline.pug
\ No newline at end of file
diff --git a/src/views/page/index/person.pug b/src/views/page/index/person.pug
new file mode 100644
index 0000000..a78eb26
--- /dev/null
+++ b/src/views/page/index/person.pug
@@ -0,0 +1,9 @@
+extends /layouts/pure.pug
+
+block pageHead
+  +css("css/page/index.css")
+
+block pageContent
+    +include()
+        - let timeLine = [{icon: '11',title: "aaaa",desc:"asd"}]
+        include /htmx/timeline.pug
\ No newline at end of file