From de9c96310012286a81b98ce5f230f3600e0e9830 Mon Sep 17 00:00:00 2001
From: "1152958806@qq.com" <1152958806@qq.com>
Date: Wed, 20 Sep 2023 20:27:58 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=85=B3=E4=BA=8E=E6=88=91?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E5=80=99=EF=BC=8C=E6=95=B0=E6=8D=AE=E7=BB=9F?=
 =?UTF-8?q?=E8=AE=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 templates/about.html                          | 137 +++++++++---------
 templates/modules/head.html                   |   2 +-
 .../widgets/about-widgets/hello-about.html    |  14 +-
 .../widgets/about-widgets/statistics-map.html | 123 ++++++++--------
 4 files changed, 139 insertions(+), 137 deletions(-)

diff --git a/templates/about.html b/templates/about.html
index 953180ac..48a4ab0b 100644
--- a/templates/about.html
+++ b/templates/about.html
@@ -39,91 +39,84 @@
 
                     <th:block th:replace="~{modules/about-widgets :: about-widgets(${theme.config.about.widgets})}"></th:block>
 
-                </div>
-
-                <div class="author-content">
-                    <div class="create-site-post author-content-item single" th:utext="${theme.config.about.xjlc}">
+                    <div class="author-content">
+                        <div class="create-site-post author-content-item single" th:utext="${theme.config.about.xjlc}">
+                        </div>
                     </div>
-                </div>
-                <div class="author-content">
-                    <div class="author-content-item single reward" id="about-reward">
-                        <div class="author-content-item-tips">致谢</div>
-                        <span class="author-content-item-title" >[[${theme.config.aboutReward.title}]]</span>
-                        <div class="author-content-item-description" >
-                            [[${theme.config.aboutReward.content}]]
-                        </div>
-
-                        <div th:if="${theme.config.aboutReward.reward.enable_reward}" class="about-reward">
-                            <div id="con"></div>
-                            <div id="TA-con" onclick="heo.rewardShowConsole()">
-                                <div id="text-con">
-                                    <div id="linght"></div>
-                                    <div id="TA">[[${theme.config.aboutReward.reward.name}]]</div>
-                                </div>
+                    <div class="author-content">
+                        <div class="author-content-item single reward" id="about-reward">
+                            <div class="author-content-item-tips">致谢</div>
+                            <span class="author-content-item-title" >[[${theme.config.aboutReward.title}]]</span>
+                            <div class="author-content-item-description" >
+                                [[${theme.config.aboutReward.content}]]
                             </div>
-                            <div id="tube-con"><svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
-                                <path d="M1 77H234.226L307.006 24H790" stroke="#e5e9ef" stroke-width="20"></path>
-                                <path d="M0 140H233.035L329.72 71H1028" stroke="#e5e9ef" stroke-width="20"></path>
-                                <path d="M1 255H234.226L307.006 307H790" stroke="#e5e9ef" stroke-width="20"></path>
-                                <path d="M0 305H233.035L329.72 375H1028" stroke="#e5e9ef" stroke-width="20"></path>
-                                <rect y="186" width="236" height="24" fill="#e5e9ef"></rect>
-                                <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#e5e9ef"></ellipse>
-                                <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
-                                <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#e5e9ef"></ellipse>
-                                <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
-                            </svg>
-                                <div id="mask"><svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
-                                    <path d="M1 77H234.226L307.006 24H790" stroke="#f25d8e" stroke-width="20"></path>
-                                    <path d="M0 140H233.035L329.72 71H1028" stroke="#f25d8e" stroke-width="20"></path>
-                                    <path d="M1 255H234.226L307.006 307H790" stroke="#f25d8e" stroke-width="20"></path>
-                                    <path d="M0 305H233.035L329.72 375H1028" stroke="#f25d8e" stroke-width="20"></path>
-                                    <rect y="186" width="236" height="24" fill="#f25d8e"></rect>
-                                    <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#f25d8e"></ellipse>
-                                    <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
-                                    <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#f25d8e"></ellipse>
-                                    <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
-                                </svg></div>
-                                <div id="orange-mask"><svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
-                                    <path d="M1 77H234.226L307.006 24H790" stroke="#ffd52b" stroke-width="20"></path>
-                                    <path d="M0 140H233.035L329.72 71H1028" stroke="#ffd52b" stroke-width="20"></path>
-                                    <path d="M1 255H234.226L307.006 307H790" stroke="#ffd52b" stroke-width="20"></path>
-                                    <path d="M0 305H233.035L329.72 375H1028" stroke="#ffd52b" stroke-width="20"></path>
-                                    <rect y="186" width="236" height="24" fill="#ffd52b"></rect>
-                                    <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#ffd52b"></ellipse>
-                                    <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
-                                    <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#ffd52b"></ellipse>
-                                    <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
-                                </svg></div>
-                                <p id="people">共<b>[[${theme.config.aboutReward.reward_list.size()}]]</b>人</p>
-                            </div>
-                        </div>
-                        <div class="reward-list-all" th:if="${not #lists.isEmpty(theme.config.aboutReward.reward_list)}"
-                             th:with="authorRewardList = ${theme.config.aboutReward.reward_list}">
 
-                            <div class="reward-list-item" th:each="authorReward : ${authorRewardList}">
-                                <div class="reward-list-item-name">[[${authorReward.name}]]</div>
-                                <div class="reward-list-bottom-group">
-                                    <div th:if="${authorReward.sign == 'N'}" class="reward-list-item-money">¥
-                                        [[${authorReward.amount}]]</div>
-                                    <div th:if="${authorReward.sign == 'Y'}" class="reward-list-item-money"
-                                         style="background: var(--heo-vip);">¥ [[${authorReward.amount}]]
+                            <div th:if="${theme.config.aboutReward.reward.enable_reward}" class="about-reward">
+                                <div id="con"></div>
+                                <div id="TA-con" onclick="heo.rewardShowConsole()">
+                                    <div id="text-con">
+                                        <div id="linght"></div>
+                                        <div id="TA">[[${theme.config.aboutReward.reward.name}]]</div>
                                     </div>
-                                    <time class="datatime reward-list-item-time">[[${authorReward.datatime}]]</time>
+                                </div>
+                                <div id="tube-con"><svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                    <path d="M1 77H234.226L307.006 24H790" stroke="#e5e9ef" stroke-width="20"></path>
+                                    <path d="M0 140H233.035L329.72 71H1028" stroke="#e5e9ef" stroke-width="20"></path>
+                                    <path d="M1 255H234.226L307.006 307H790" stroke="#e5e9ef" stroke-width="20"></path>
+                                    <path d="M0 305H233.035L329.72 375H1028" stroke="#e5e9ef" stroke-width="20"></path>
+                                    <rect y="186" width="236" height="24" fill="#e5e9ef"></rect>
+                                    <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#e5e9ef"></ellipse>
+                                    <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
+                                    <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#e5e9ef"></ellipse>
+                                    <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
+                                </svg>
+                                    <div id="mask"><svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                        <path d="M1 77H234.226L307.006 24H790" stroke="#f25d8e" stroke-width="20"></path>
+                                        <path d="M0 140H233.035L329.72 71H1028" stroke="#f25d8e" stroke-width="20"></path>
+                                        <path d="M1 255H234.226L307.006 307H790" stroke="#f25d8e" stroke-width="20"></path>
+                                        <path d="M0 305H233.035L329.72 375H1028" stroke="#f25d8e" stroke-width="20"></path>
+                                        <rect y="186" width="236" height="24" fill="#f25d8e"></rect>
+                                        <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#f25d8e"></ellipse>
+                                        <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
+                                        <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#f25d8e"></ellipse>
+                                        <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
+                                    </svg></div>
+                                    <div id="orange-mask"><svg viewBox="0 0 1028 385" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                        <path d="M1 77H234.226L307.006 24H790" stroke="#ffd52b" stroke-width="20"></path>
+                                        <path d="M0 140H233.035L329.72 71H1028" stroke="#ffd52b" stroke-width="20"></path>
+                                        <path d="M1 255H234.226L307.006 307H790" stroke="#ffd52b" stroke-width="20"></path>
+                                        <path d="M0 305H233.035L329.72 375H1028" stroke="#ffd52b" stroke-width="20"></path>
+                                        <rect y="186" width="236" height="24" fill="#ffd52b"></rect>
+                                        <ellipse cx="790" cy="25.5" rx="25" ry="25.5" fill="#ffd52b"></ellipse>
+                                        <circle r="14" transform="matrix(1 0 0 -1 790 25)" fill="white"></circle>
+                                        <ellipse cx="790" cy="307.5" rx="25" ry="25.5" fill="#ffd52b"></ellipse>
+                                        <circle r="14" transform="matrix(1 0 0 -1 790 308)" fill="white"></circle>
+                                    </svg></div>
+                                    <p id="people">共<b>[[${theme.config.aboutReward.reward_list.size()}]]</b>人</p>
                                 </div>
                             </div>
+                            <div class="reward-list-all" th:if="${not #lists.isEmpty(theme.config.aboutReward.reward_list)}"
+                                 th:with="authorRewardList = ${theme.config.aboutReward.reward_list}">
 
+                                <div class="reward-list-item" th:each="authorReward : ${authorRewardList}">
+                                    <div class="reward-list-item-name">[[${authorReward.name}]]</div>
+                                    <div class="reward-list-bottom-group">
+                                        <div th:if="${authorReward.sign == 'N'}" class="reward-list-item-money">¥
+                                            [[${authorReward.amount}]]</div>
+                                        <div th:if="${authorReward.sign == 'Y'}" class="reward-list-item-money"
+                                             style="background: var(--heo-vip);">¥ [[${authorReward.amount}]]
+                                        </div>
+                                        <time class="datatime reward-list-item-time">[[${authorReward.datatime}]]</time>
+                                    </div>
+                                </div>
+
+                            </div>
                         </div>
                     </div>
                 </div>
 
-
-
-
             </div>
 
-            <!-- 评论模块 -->
-
-
         </main>
         <!-- 底部 -->
         <footer th:replace="~{modules/footer :: footer}"></footer>
diff --git a/templates/modules/head.html b/templates/modules/head.html
index 187c1b51..fb17b4af 100644
--- a/templates/modules/head.html
+++ b/templates/modules/head.html
@@ -170,7 +170,7 @@
     <link rel="stylesheet" href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/fancybox/3.5.7/jquery.fancybox.min.css">
 
     <!-- 关于统计-->
-    <script th:src="${assets_link + '/libs/countup/countup.js'}"></script>
+    <script th:if="${#strings.contains(theme.config.about.widgets,'statistics-map')}" th:src="${assets_link + '/libs/countup/countup.js'}"></script>
 
     <!-- 小板报 -->
     <th:block th:if="${not #strings.isEmpty(theme.config.sidebar.welcome.key)}">
diff --git a/templates/modules/widgets/about-widgets/hello-about.html b/templates/modules/widgets/about-widgets/hello-about.html
index e72f06c8..f2890577 100644
--- a/templates/modules/widgets/about-widgets/hello-about.html
+++ b/templates/modules/widgets/about-widgets/hello-about.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org">
-<!-- 我的介绍&我的想法 -->
+<!-- hello -->
 <div class="hello-about" th:fragment="hello-about">
     <div class="cursor" style="translate: none; rotate: none; scale: none; transform: translate(721px,180px);"></div>
     <div class="shapes">
@@ -17,7 +17,6 @@
     <div class="content">
         <h1>[[${theme.config.about.helloAbout}]]</h1>
     </div>
-    <script src="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/gsap/3.9.1/gsap.min.js"></script>
     <style>
         .hello-about {
             margin: 20px auto 0;
@@ -133,8 +132,8 @@
             background: #2128bd;
         }
     </style>
-    <script>
-        (() => {
+    <script defer>
+        function initHelloAbout() {
             const helloAboutEl = document.querySelector(".hello-about");
             helloAboutEl.addEventListener("mousemove", evt => {
                 const mouseX = evt.offsetX;
@@ -150,7 +149,12 @@
                     stagger: -0.1,
                 });
             });
-        })();
+        }
+        if (typeof gsap === "object") {
+            initHelloAbout()
+        } else {
+            getScript("https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/gsap/3.9.1/gsap.min.js").then(initHelloAbout);
+        }
     </script>
 
 </div>
diff --git a/templates/modules/widgets/about-widgets/statistics-map.html b/templates/modules/widgets/about-widgets/statistics-map.html
index ecf93fa5..fab50e6e 100644
--- a/templates/modules/widgets/about-widgets/statistics-map.html
+++ b/templates/modules/widgets/about-widgets/statistics-map.html
@@ -97,72 +97,77 @@
             }
         }
     </style>
-    <script>
+    <!-- 关于统计-->
+    <script defer>
         // 链接替换即可，不需要后面的参数
-        fetch("https://v6-widget.51.la/v6/[[${theme.config.about.LingQueMonitorID}]]/quote.js")
-            .then(res => res.text())
-            .then(data => {
-                let title = ["最近活跃", "今日人数", "今日访问", "昨日人数", "昨日访问", "本月访问", "总访问量"];
-                // let num = data.match(/(?<=<\/span><span>).*?(?=<\/span><\/p>)/g)
-                let num = data.match(/(<\/span><span>).*?(\/span><\/p>)/g);
+        function initAboutPage() {
+            fetch("https://v6-widget.51.la/v6/[[${theme.config.about.LingQueMonitorID}]]/quote.js")
+                .then(res => res.text())
+                .then(data => {
+                    let title = ["最近活跃", "今日人数", "今日访问", "昨日人数", "昨日访问", "本月访问", "总访问量"];
+                    // let num = data.match(/(?<=<\/span><span>).*?(?=<\/span><\/p>)/g)
+                    let num = data.match(/(<\/span><span>).*?(\/span><\/p>)/g);
 
-                num = num.map(el => {
-                    let val = el.replace(/(<\/span><span>)/g, "");
-                    let str = val.replace(/(<\/span><\/p>)/g, "");
-                    return str;
-                });
-
-                let statisticEl = document.getElementById("statistic");
-
-                // 自定义不显示哪个或者显示哪个，如下为不显示 最近活跃访客 和 总访问量
-                let statistic = [];
-                for (let i = 0; i < num.length; i++) {
-                    if (!statisticEl) return;
-                    if (i == 0) continue;
-                    statisticEl.innerHTML +=
-                        "<div><span>" + title[i] + "</span><span id=" + title[i] + ">" + num[i] + "</span></div>";
-                    queueMicrotask(() => {
-                        statistic.push(
-                            new CountUp(title[i], 0, num[i], 0, 2, {
-                                useEasing: true,
-                                useGrouping: true,
-                                separator: ",",
-                                decimal: ".",
-                                prefix: "",
-                                suffix: "",
-                            })
-                        );
+                    num = num.map(el => {
+                        let val = el.replace(/(<\/span><span>)/g, "");
+                        let str = val.replace(/(<\/span><\/p>)/g, "");
+                        return str;
                     });
-                }
 
-                let statisticElement = document.querySelector(".about-statistic.author-content-item");
-                function statisticUP() {
-                    if (!statisticElement) return;
+                    let statisticEl = document.getElementById("statistic");
 
-                    const callback = (entries, observer) => {
-                        entries.forEach(entry => {
-                            if (entry.isIntersecting) {
-                                for (let i = 0; i < num.length; i++) {
-                                    if (i == 0) continue;
-                                    queueMicrotask(() => {
-                                        statistic[i - 1].start();
-                                    });
-                                }
-                                observer.disconnect(); // 停止观察元素，因为不再需要触发此回调
-                            }
+                    // 自定义不显示哪个或者显示哪个，如下为不显示 最近活跃访客 和 总访问量
+                    let statistic = [];
+                    for (let i = 0; i < num.length; i++) {
+                        if (!statisticEl) return;
+                        if (i == 0) continue;
+                        statisticEl.innerHTML +=
+                            "<div><span>" + title[i] + "</span><span id=" + title[i] + ">" + num[i] + "</span></div>";
+                        queueMicrotask(() => {
+                            statistic.push(
+                                new CountUp(title[i], 0, num[i], 0, 2, {
+                                    useEasing: true,
+                                    useGrouping: true,
+                                    separator: ",",
+                                    decimal: ".",
+                                    prefix: "",
+                                    suffix: "",
+                                })
+                            );
                         });
-                    };
+                    }
+
+                    let statisticElement = document.querySelector(".about-statistic.author-content-item");
+                    function statisticUP() {
+                        if (!statisticElement) return;
+
+                        const callback = (entries, observer) => {
+                            entries.forEach(entry => {
+                                if (entry.isIntersecting) {
+                                    for (let i = 0; i < num.length; i++) {
+                                        if (i == 0) continue;
+                                        queueMicrotask(() => {
+                                            statistic[i - 1].start();
+                                        });
+                                    }
+                                    observer.disconnect(); // 停止观察元素，因为不再需要触发此回调
+                                }
+                            });
+                        };
+
+                        const options = {
+                            root: null,
+                            rootMargin: "0px",
+                            threshold: 0
+                        };
+                        const observer = new IntersectionObserver(callback, options);
+                        observer.observe(statisticElement);
+                    }
+                    statisticUP()
+                });
+        }
+        initAboutPage();
 
-                    const options = {
-                        root: null,
-                        rootMargin: "0px",
-                        threshold: 0
-                    };
-                    const observer = new IntersectionObserver(callback, options);
-                    observer.observe(statisticElement);
-                }
-                statisticUP()
-            });
     </script>
 </div>