Merge pull request #12 from liuzhihang/dev

支持自定义右上角六篇文章
2022-11-20 14:01:56 +08:00 · 2022-11-20 14:01:56 +08:00 · 118c8cefcd
parent 8278b8c261 a422e4fee1
commit 118c8cefcd
2 changed files with 61 additions and 4 deletions
--- a/settings.yaml
+++ b/settings.yaml
@ -173,6 +173,39 @@ spec:
              label: 今日推荐背景图
              placeholder: 请输入地址
              validation: "url"
+        - $formkit: select
+          if: "$get(recentTop).value"
+          name: recommendPost
+          id: recommendPost
+          key: recommendPost
+          label: 推荐文章
+          value: latest
+          options:
+            - label: 最新文章
+              value: latest
+            - label: 自定义
+              value: custom
+        - $formkit: repeater
+          if: "$get(recommendPost).value === custom"
+          name: recommendPostCustom
+          label: 自定义文章
+          help: "建议设置六篇文章"
+          value:
+            - url:
+              title:
+              cover:
+          children:
+            - $formkit: url
+              name: url
+              label: 链接
+              validation: "url"
+            - $formkit: text
+              name: title
+              label: 标题
+            - $formkit: url
+              name: cover
+              label: 封面地址
+              validation: "url"

    - group: layout
      label: 布局
@ -337,7 +370,7 @@ spec:
                - $formkit: text
                  name: name
                  label: 名称
-                - $formkit: text
+                - $formkit: url
                  name: url
                  label: 链接
                  validation: "url"
--- a/templates/modules/widgets/top-group.html
+++ b/templates/modules/widgets/top-group.html
@ -1,9 +1,12 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org">

-<!-- 这里应该改为 6 篇置顶文章 -->
-<div class="topGroup" th:fragment="top-group" th:with="posts = ${postFinder.list(1,6)}">
-    <div class="recent-post-item" th:each="post : ${posts}">
+<!-- 可以是最近六篇文章，也可以是自定义的文章 -->
+<div class="topGroup" th:fragment="top-group">
+    <div class="recent-post-item"
+         th:each="post : ${posts}"
+         th:if="${#strings.equals(theme.config.top.recommendPost, 'latest')}"
+         th:with="posts = ${postFinder.list(1,6)}">
        <div class="post_cover">
            <a th:href="@{${post.status.permalink}}" th:title="${post.spec.title}">
                <span class="recent-post-top-text">荐</span>
@ -21,6 +24,27 @@
        </div>
    </div>

+    <div class="recent-post-item"
+         th:each="cuscomPost : ${theme.config.top.recommendPostCustom}"
+         th:if="${#strings.equals(theme.config.top.recommendPost, 'custom')}">
+        <div class="post_cover">
+            <a th:href="@{${cuscomPost.url}}" th:title="${cuscomPost.title}">
+                <span class="recent-post-top-text">荐</span>
+                <img class="post_bg" loading="lazy"
+                     th:alt="${cuscomPost.title}"
+                     th:src="${cuscomPost.cover}">
+            </a>
+        </div>
+        <div class="recent-post-info">
+            <a class="article-title"
+               th:href="@{${cuscomPost.url}}"
+               th:text="${cuscomPost.title}"
+               th:title="${cuscomPost.title}">
+            </a>
+        </div>
+    </div>
+
+
    <!-- 今日推荐 -->
    <div class="todayCard" id="todayCard"
         th:if="${theme.config.top.todayRecommendSwitch}"