Update pub.js

Author: suan12

cssjs/pub.js

@@ -1,20 +1,24 @@
-.year-filter {
-  margin-bottom: 20px;
-}
-.year-filter button {
-  margin: 5px;
-  padding: 10px;
-  cursor: pointer;
-  border: 1px solid #ccc;
-  background-color: #f9f9f9;
-}
-.year-filter button.active {
-  background-color: #007bff;
-  color: white;
-}
-.publication li {
-  display: none; /* 默认隐藏所有文章 */
-}
-.publication li.show {
-  display: block; /* 显示符合条件的文章 */
+function filterPublications(year) {
+  const publications = document.querySelectorAll('.publication li');
+  const buttons = document.querySelectorAll('.year-filter button');
+
+  // 移除所有按钮的 active 类
+  buttons.forEach(button => button.classList.remove('active'));
+
+  // 为当前点击的按钮添加 active 类
+  const activeButton = document.querySelector(`.year-filter button[onclick="filterPublications('${year}')"]`);
+  activeButton.classList.add('active');
+
+  // 遍历所有文章，根据年份显示或隐藏
+  publications.forEach(publication => {
+    const publicationYear = publication.getAttribute('data-year');
+    if (year === 'all' || publicationYear === year) {
+      publication.classList.add('show');
+    } else {
+      publication.classList.remove('show');
+    }
+  });
 }
+
+// 默认显示所有文章
+filterPublications('all');