globals/static/index.html

@@ -8,9 +8,9 @@
   <meta name="keywords" content="<< .Keywords >>">
   <meta name="anthor" content="srcrs">
   <!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> -->
-  <link rel="stylesheet" href="static/index.css">
+  <link rel="stylesheet" href="static/index.min.css">
   << if .DarkMode >>
-<!--    <link rel="stylesheet" href="static/dark-mode.css">-->
+    <link rel="stylesheet" href="static/dark-mode.css">
   << end >>
   <link rel="icon" href="static/favicon.svg" type="image/x-icon">
   <style>
@@ -24,18 +24,11 @@
     }
 
     .card-header {
-      font-size: 15px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 18px;
       font-weight: bold;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      text-align: left;
-      margin-bottom: 10px;
-      background: linear-gradient(to bottom, #007f80, #007070);
-      color: white;
-      line-height: 2em;
-      border-radius: 6px;
-      padding: 0 0.5em;
     }
 
     .list-item {
@@ -46,32 +39,32 @@
     }
 
     .list-item-title {
-      display: block;
+      display: flex;
-      white-space: nowrap;
+      /* white-space: nowrap;
       overflow: hidden;
-      text-overflow: ellipsis;
+      text-overflow: ellipsis; */
       flex-grow: 1;
       text-align: left;
       width: 100%;
       margin-bottom: 10px;
-      font-size: 15px;
-      align-items: center; /* 确保内容垂直居中 */
-    }
-    .title-link {
-      display: block;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      text-align: left;
     }
 
     a {
       color: black;
       text-decoration: none;
     }
+
+    a:hover {
+      text-decoration: underline;
+    }
     .feed-col {
       margin-bottom: 20px;
     }
+
+    .time {
+      font-size: 12px;
+      color: #999;
+    }
   </style>
 </head>
 
@@ -79,12 +72,7 @@
   <div id="app">
     <el-container>
       <el-header>
-        <h1>
+        <h1>RSS Reader</h1>
-          RSS Reader
-          << if gt .AutoUpdatePush 0 >>
-            <span v-show="isPc"><br/>{{ countdown }} s</span>
-          << end >>
-        </h1>
       </el-header>
       <el-main v-loading.fullscreen.lock="fullscreenLoading" element-loading-text="拼命加载中">
         <el-row :gutter="20">
@@ -96,7 +84,7 @@
                     << $feed.Title >>
                   </span>
                 </div>
-                <el-scrollbar style="height: 580px;">
+                <el-scrollbar style="height: 300px;">
                   << range $i, $item :=$feed.Items >>
                     <el-list key="<< $i >>">
                       <el-list-item>
@@ -125,7 +113,7 @@
                   <div slot="header" class="card-header">
                     <span>{{ feed.title }}</span>
                   </div>
-                  <el-scrollbar style="height: 580px;">
+                  <el-scrollbar style="height: 300px;">
                     <el-list v-for="(item, i) in feed.items" :key="i">
                       <el-list-item>
                         <div class="list-item-title">
@@ -135,9 +123,9 @@
                       </el-list-item>
                     </el-list>
                   </el-scrollbar>
-<!--                  <div slot="footer" class="card-footer" style="height: 10px;">-->
+                  <div slot="footer" class="card-footer" style="height: 10px;">
-<!--                    <time class="time">{{ feed.custom.lastupdate }}</time>-->
+                    <time class="time">{{ feed.custom.lastupdate }}</time>
-<!--                  </div>-->
+                  </div>
                 </el-card>
               </el-col>
         </el-row>
@@ -162,15 +150,10 @@
           feeds: [],
           showSEOFlag: true,
           fullscreenLoading: true,
-          countdown: 60,
-          isPc: true,
-          autoUpdatePush: << .AutoUpdatePush >>,
         };
       },
       async created() {
         this.fullscreenLoading = false;
-        // 使用媒体查询判断设备类型
-        this.isPc = !window.matchMedia('(max-width: 767px)').matches;
       },
       async mounted() {
         const protocol = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
@@ -186,39 +169,17 @@
             }
             this.showSEOFlag = false;
           };
-          const reloadHtml = () => {
-            if (socket.readyState === WebSocket.CLOSED || socket.readyState === WebSocket.CLOSING) {
-              if (document.visibilityState === 'visible') {
-                // 刷新网页
-                console.log("reload...")
-                location.reload();
-              }
-            }
-          }
           socket.onclose = event => {
-            if (this.isPc && this.autoUpdatePush > 0) {
             console.log("WebSocket closed. Reconnecting...");
-              setInterval(reloadHtml, 3000);
+            setTimeout(connect, 300000);
-            }
           };
-          // Send heartbeat message every 60 seconds
+          // Send heartbeat message every 120 seconds
           const sendHeartbeat = () => {
             if (socket.readyState === WebSocket.OPEN) {
               socket.send("heartbeat");
-            } else if (socket.readyState === WebSocket.CLOSED || socket.readyState === WebSocket.CLOSING) {
-              reloadHtml()
             }
           };
-          if (this.isPc && this.autoUpdatePush > 0) {
+          setInterval(sendHeartbeat, 120000);
-            setInterval(sendHeartbeat, 60000);
-            setInterval(() => {
-              if (this.countdown > 0) {
-                this.countdown--;
-              } else {
-                this.countdown = 60;
-              }
-            }, 1000);
-          }
         };
         connect();
       },

main.go

@@ -67,12 +67,10 @@ func tplHandler(w http.ResponseWriter, r *http.Request) {
 		Keywords    string
 		RssDataList []models.Feed
 		DarkMode    bool
-		AutoUpdatePush int
 	}{
 		Keywords:    getKeywords(),
 		RssDataList: utils.GetFeeds(),
 		DarkMode:    darkMode,
-		AutoUpdatePush: globals.RssUrls.AutoUpdatePush,
 	}
 
 	// 渲染模板并将结果写入响应