From 14f86f394d32ad0125f908b0569539b18237a4f8 Mon Sep 17 00:00:00 2001 From: peijunlei Date: Wed, 2 Sep 2026 13:58:32 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat(news):=20=E6=9B=B4=E6=96=B0=E6=96=B0?= =?UTF-8?q?=E9=97=BB=E5=88=97=E8=A1=A8=E6=A8=A1=E5=9D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/themes/dist_static/static/css/news.css | 95 +++++++++++++-------------- public/themes/dist_static/static/js/news2.js | 87 +++++++++++++++++++++++- 2 files changed, 132 insertions(+), 50 deletions(-) diff --git a/public/themes/dist_static/static/css/news.css b/public/themes/dist_static/static/css/news.css index f351102..d3f5b33 100644 --- a/public/themes/dist_static/static/css/news.css +++ b/public/themes/dist_static/static/css/news.css @@ -43,7 +43,7 @@ font-size: var(--font-18); font-weight: 400; line-height: var(--font-24); - cursor: default; + cursor: pointer; } .n-tabs__item.is-active { background: var(--color-primary); @@ -81,15 +81,21 @@ } .n-featured { - display: grid; - grid-template-columns: minmax(0, 45rem) minmax(0, 1fr); - gap: 3rem; - align-items: center; + position: relative; padding: 3rem; margin-bottom: 5rem; border-radius: 2.5rem; background: rgba(175, 181, 185, 0.15); } +.n-featured__swiper { + overflow: hidden; +} +.n-featured__slide { + display: grid; + grid-template-columns: minmax(0, 45rem) minmax(0, 1fr); + gap: 3rem; + align-items: center; +} .n-featured__media { min-width: 0; border-radius: 2rem; @@ -130,8 +136,14 @@ font-family: "MiSans VF", "PingFang SC", sans-serif; font-size: var(--font-28); font-weight: 500; - line-height: var(--font-37); + line-height: var(--font-36); transition: color var(--duration-fast) var(--easing); + min-height: 4.5rem; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; } .n-featured__desc { margin: 0; @@ -140,6 +152,12 @@ font-size: var(--font-18); font-weight: 400; line-height: var(--font-28); + min-height: 5.25rem; + display: -webkit-box; + -webkit-line-clamp: 3; + line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; } .n-featured__foot { display: flex; @@ -148,13 +166,15 @@ gap: 1.5rem; margin-top: auto; padding-top: 2rem; + padding-right: 8rem; border-top: 1px solid rgb(223, 224, 226); transition: border-color var(--duration-fast) var(--easing); } .n-featured__nav { - display: flex; - align-items: center; - gap: 1rem; + position: absolute; + right: 3rem; + bottom: 3rem; + z-index: 2; } .n-featured:hover { cursor: pointer; @@ -169,33 +189,6 @@ border-top-color: var(--color-primary); } -.n-nav-btn { - display: inline-flex; - align-items: center; - justify-content: center; - width: 3rem; - height: 3rem; - padding: 0; - border: 1px solid rgba(46, 53, 58, 0.1); - border-radius: 1rem; - background: transparent; - cursor: default; -} -.n-nav-btn img { - display: block; - width: 0.875rem; - height: auto; - transform: scaleX(-1); - filter: grayscale(1) opacity(0.45); -} -.n-nav-btn--active { - border-color: var(--color-primary); -} -.n-nav-btn--active img { - transform: none; - filter: none; -} - .n-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); @@ -330,12 +323,15 @@ font-size: 16Px; } .n-featured { - grid-template-columns: 1fr; gap: 32Px; padding: 32Px; margin-bottom: 56Px; border-radius: 24Px; } + .n-featured__slide { + grid-template-columns: 1fr; + gap: 32Px; + } .n-featured__media { border-radius: 20Px; } @@ -356,6 +352,11 @@ .n-featured__foot { margin-top: 24Px; padding-top: 24Px; + padding-right: 112Px; + } + .n-featured__nav { + right: 32Px; + bottom: 32Px; } .n-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); @@ -408,6 +409,9 @@ margin-bottom: 40Px; border-radius: 16Px; } + .n-featured__slide { + gap: 20Px; + } .n-featured__media { border-radius: 12Px; } @@ -420,27 +424,20 @@ .n-featured__title { font-size: 20Px; line-height: 28Px; + min-height: 56Px; } .n-featured__desc { font-size: 14Px; line-height: 22Px; - display: -webkit-box; - -webkit-line-clamp: 4; - line-clamp: 4; - -webkit-box-orient: vertical; - overflow: hidden; + min-height: 66Px; } .n-featured__foot { margin-top: 16Px; - padding-top: 16Px; + min-height: 3rem; } .n-featured__nav { - gap: 12Px; - } - .n-nav-btn { - width: 40Px; - height: 40Px; - border-radius: 12Px; + right: 20Px; + bottom: 10Px; } .n-grid { grid-template-columns: 1fr; diff --git a/public/themes/dist_static/static/js/news2.js b/public/themes/dist_static/static/js/news2.js index b600feb..9d9c90d 100644 --- a/public/themes/dist_static/static/js/news2.js +++ b/public/themes/dist_static/static/js/news2.js @@ -1,4 +1,11 @@ //#region js/news.js +var NEWS_CATEGORY_PARAM = "cat"; +var NEWS_CATEGORIES = [ + "all", + "insight", + "company", + "event" +]; function setActiveNav() { const pageNav = document.querySelector("[data-nav]")?.getAttribute("data-nav"); if (!pageNav) return; @@ -20,16 +27,94 @@ function newsDetailBackToggle() { else back.removeAttribute("tabindex"); }, { threshold: 1 }).observe(pager); } +var featuredSwiper = null; +function getCategoryFromQuery() { + const cat = new URLSearchParams(window.location.search).get(NEWS_CATEGORY_PARAM); + if (!cat || cat === "all") return "all"; + return NEWS_CATEGORIES.includes(cat) ? cat : "all"; +} +function setCategoryInUrl(cat) { + const url = new URL(window.location.href); + if (!cat || cat === "all") url.searchParams.delete(NEWS_CATEGORY_PARAM); + else url.searchParams.set(NEWS_CATEGORY_PARAM, cat); + window.history.replaceState(null, "", url); +} +function activateTab(cat) { + document.querySelectorAll(".n-tabs__item").forEach((btn) => { + const isActive = (btn.dataset.cat || "all") === cat; + btn.classList.toggle("is-active", isActive); + btn.setAttribute("aria-selected", isActive ? "true" : "false"); + }); +} +function filterNews(cat) { + const isMatch = (itemCat) => cat === "all" || itemCat === cat; + document.querySelectorAll(".n-featured__slide[data-category]").forEach((slide) => { + slide.hidden = !isMatch(slide.dataset.category); + }); + document.querySelectorAll(".n-card[data-category]").forEach((card) => { + card.hidden = !isMatch(card.dataset.category); + }); + const featured = document.querySelector(".n-featured"); + if (!featured) return; + featured.hidden = featured.querySelectorAll(".n-featured__slide:not([hidden])").length === 0; +} +function updateFeaturedSwiper() { + const root = document.querySelector(".n-featured"); + const el = root?.querySelector(".n-featured__swiper"); + if (!el || !window.Swiper) return; + if (featuredSwiper) { + featuredSwiper.destroy(true, true); + featuredSwiper = null; + } + if (!root || root.hidden) return; + const slideCount = el.querySelectorAll(".swiper-wrapper > .swiper-slide:not([hidden])").length; + if (slideCount <= 1) return; + featuredSwiper = new window.Swiper(el, { + effect: "fade", + fadeEffect: { crossFade: true }, + loop: slideCount > 1, + speed: 500, + observer: true, + observeParents: true, + watchOverflow: true, + navigation: { + prevEl: root.querySelector(".n-featured__nav .s-arrows__prev"), + nextEl: root.querySelector(".n-featured__nav .s-arrows__next") + } + }); +} +function applyCategory(cat) { + activateTab(cat); + filterNews(cat); + updateFeaturedSwiper(); +} +function initNewsTabs() { + const tabs = document.querySelector(".n-tabs"); + if (!tabs) return; + applyCategory(getCategoryFromQuery()); + tabs.addEventListener("click", (event) => { + const btn = event.target.closest(".n-tabs__item"); + if (!btn) return; + const cat = btn.dataset.cat || "all"; + setCategoryInUrl(cat); + applyCategory(cat); + }); + window.addEventListener("popstate", () => { + applyCategory(getCategoryFromQuery()); + }); +} function newsCardClick() { $(".n-card, .n-featured").on("click", function(event) { if ($(event.target).closest("a, button").length) return; - const href = $(this).find("a[href]").attr("href"); + const $root = $(this); + const href = $root.hasClass("n-featured") ? $root.find(".swiper-slide-active a[href]").attr("href") : $root.find("a[href]").first().attr("href"); if (href) window.location.href = href; }); } $(function() { setActiveNav(); newsDetailBackToggle(); + initNewsTabs(); newsCardClick(); }); //#endregion From dda71cb663aa0b62c0d6597483fe590624a53d76 Mon Sep 17 00:00:00 2001 From: peijunlei Date: Wed, 2 Sep 2026 14:16:26 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat(search):=20=E7=BB=9F=E4=B8=80=E6=90=9C?= =?UTF-8?q?=E7=B4=A2=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/themes/dist_static/static/js/announce.js | 31 ++++++++++++++++++++++ public/themes/dist_static/static/js/download.js | 4 +-- public/themes/dist_static/static/js/faq.js | 34 ++++++++++++++++++++++--- public/themes/dist_static/static/js/video.js | 31 ++++++++++++++++++++++ public/themes/website/1/zh/demo/announce.html | 4 +-- public/themes/website/1/zh/demo/download.html | 6 ++--- public/themes/website/1/zh/demo/faq.html | 4 +-- public/themes/website/1/zh/demo/video.html | 4 +-- 8 files changed, 103 insertions(+), 15 deletions(-) diff --git a/public/themes/dist_static/static/js/announce.js b/public/themes/dist_static/static/js/announce.js index 21499ab..d2836a0 100644 --- a/public/themes/dist_static/static/js/announce.js +++ b/public/themes/dist_static/static/js/announce.js @@ -45,8 +45,39 @@ function initFilterDropdown() { if (!$(event.target).closest("[data-filter-trigger], [data-filter-dropdown]").length) closeDropdown(); }); } +function getActiveTabId() { + return $("[data-filter-dropdown] .is-active[data-tab]").attr("data-tab") || ""; +} +function activateTabById(tabId) { + if (!tabId) return; + const $item = $(`[data-filter-dropdown] [data-tab="${tabId}"]`).first(); + if (!$item.length) return; + const $dropdown = $item.closest("[data-filter-dropdown]"); + const $btn = $dropdown.prev("[data-filter-trigger]"); + $item.addClass("is-active").siblings().removeClass("is-active"); + $btn.find("span").text($item.text()); + $btn.addClass("is-selected"); +} +function initTabKeywordsSearch() { + $("[data-tab-search]").on("submit", function(event) { + event.preventDefault(); + const params = new URLSearchParams(); + const keywords = $(this).find('[name="keywords"]').val().trim(); + const tabId = getActiveTabId(); + if (tabId) params.set("tab", tabId); + if (keywords) params.set("keywords", keywords); + const query = params.toString(); + window.location.href = query ? `${window.location.pathname}?${query}` : window.location.pathname; + }); + const searchParams = new URLSearchParams(window.location.search); + const tabParam = searchParams.get("tab"); + const keywordsParam = searchParams.get("keywords"); + if (keywordsParam) $("[data-tab-search] [name='keywords']").val(keywordsParam); + if (tabParam) activateTabById(tabParam); +} $(function() { setActiveNav(); initFilterDropdown(); + initTabKeywordsSearch(); }); //#endregion diff --git a/public/themes/dist_static/static/js/download.js b/public/themes/dist_static/static/js/download.js index 248e195..0750a72 100644 --- a/public/themes/dist_static/static/js/download.js +++ b/public/themes/dist_static/static/js/download.js @@ -65,7 +65,7 @@ $(function() { $(document).on("click", function(event) { if (!$(event.target).closest(".d-tabs__group").length) closeDropdowns(); }); - $("[data-download-search]").on("submit", function(event) { + $("[data-tab-search]").on("submit", function(event) { event.preventDefault(); const params = new URLSearchParams(); const keywords = $(this).find('[name="keywords"]').val().trim(); @@ -78,7 +78,7 @@ $(function() { const searchParams = new URLSearchParams(window.location.search); const tabParam = searchParams.get("tab"); const keywordsParam = searchParams.get("keywords"); - if (keywordsParam) $("[data-download-search] [name='keywords']").val(keywordsParam); + if (keywordsParam) $("[data-tab-search] [name='keywords']").val(keywordsParam); if (tabParam) activateTabById(tabParam); }); //#endregion diff --git a/public/themes/dist_static/static/js/faq.js b/public/themes/dist_static/static/js/faq.js index fdaaf53..102e60b 100644 --- a/public/themes/dist_static/static/js/faq.js +++ b/public/themes/dist_static/static/js/faq.js @@ -8,12 +8,39 @@ function setActiveNav() { link.classList.toggle("is-active", active); }); } +function activateFaqTab($btn) { + $btn.addClass("is-active").attr("aria-selected", "true"); + $btn.siblings(".f-tabs__item").removeClass("is-active").attr("aria-selected", "false"); +} +function getActiveTabId() { + return $(".f-tabs__item.is-active").attr("data-tab") || ""; +} +function activateTabById(tabId) { + if (!tabId) return; + const $target = $(`.f-tabs__item[data-tab="${tabId}"]`).first(); + if ($target.length) activateFaqTab($target); +} +function initTabKeywordsSearch() { + $("[data-tab-search]").on("submit", function(event) { + event.preventDefault(); + const params = new URLSearchParams(); + const keywords = $(this).find('[name="keywords"]').val().trim(); + const tabId = getActiveTabId(); + if (tabId) params.set("tab", tabId); + if (keywords) params.set("keywords", keywords); + const query = params.toString(); + window.location.href = query ? `${window.location.pathname}?${query}` : window.location.pathname; + }); + const searchParams = new URLSearchParams(window.location.search); + const tabParam = searchParams.get("tab"); + const keywordsParam = searchParams.get("keywords"); + if (keywordsParam) $("[data-tab-search] [name='keywords']").val(keywordsParam); + if (tabParam) activateTabById(tabParam); +} $(function() { setActiveNav(); $(".f-tabs__item").on("click", function() { - const $btn = $(this); - $btn.addClass("is-active").attr("aria-selected", "true"); - $btn.siblings(".f-tabs__item").removeClass("is-active").attr("aria-selected", "false"); + activateFaqTab($(this)); }); $(".f-item__trigger").on("click", function() { const $item = $(this).closest(".f-item"); @@ -22,5 +49,6 @@ $(function() { $item.toggleClass("is-open", willOpen); $(this).attr("aria-expanded", willOpen ? "true" : "false"); }); + initTabKeywordsSearch(); }); //#endregion diff --git a/public/themes/dist_static/static/js/video.js b/public/themes/dist_static/static/js/video.js index 8ec71be..58b5d7c 100644 --- a/public/themes/dist_static/static/js/video.js +++ b/public/themes/dist_static/static/js/video.js @@ -86,9 +86,40 @@ function initFilterDropdown() { if (!$(event.target).closest("[data-filter-trigger], [data-filter-dropdown]").length) closeDropdown(); }); } +function getActiveTabId() { + return $("[data-filter-dropdown] .is-active[data-tab]").attr("data-tab") || ""; +} +function activateTabById(tabId) { + if (!tabId) return; + const $item = $(`[data-filter-dropdown] [data-tab="${tabId}"]`).first(); + if (!$item.length) return; + const $dropdown = $item.closest("[data-filter-dropdown]"); + const $btn = $dropdown.prev("[data-filter-trigger]"); + $item.addClass("is-active").siblings().removeClass("is-active"); + $btn.find("span").text($item.text()); + $btn.addClass("is-selected"); +} +function initTabKeywordsSearch() { + $("[data-tab-search]").on("submit", function(event) { + event.preventDefault(); + const params = new URLSearchParams(); + const keywords = $(this).find('[name="keywords"]').val().trim(); + const tabId = getActiveTabId(); + if (tabId) params.set("tab", tabId); + if (keywords) params.set("keywords", keywords); + const query = params.toString(); + window.location.href = query ? `${window.location.pathname}?${query}` : window.location.pathname; + }); + const searchParams = new URLSearchParams(window.location.search); + const tabParam = searchParams.get("tab"); + const keywordsParam = searchParams.get("keywords"); + if (keywordsParam) $("[data-tab-search] [name='keywords']").val(keywordsParam); + if (tabParam) activateTabById(tabParam); +} $(function() { setActiveNav(); initVideoModal(); initFilterDropdown(); + initTabKeywordsSearch(); }); //#endregion diff --git a/public/themes/website/1/zh/demo/announce.html b/public/themes/website/1/zh/demo/announce.html index 11123f3..7cae52c 100644 --- a/public/themes/website/1/zh/demo/announce.html +++ b/public/themes/website/1/zh/demo/announce.html @@ -80,9 +80,9 @@ - diff --git a/public/themes/website/1/zh/demo/download.html b/public/themes/website/1/zh/demo/download.html index 05f6801..95f8811 100644 --- a/public/themes/website/1/zh/demo/download.html +++ b/public/themes/website/1/zh/demo/download.html @@ -1,8 +1,6 @@ -{php}$download_keywords = input('keywords', '');{/php} - @@ -87,9 +85,9 @@ {/if} {/volist} - diff --git a/public/themes/website/1/zh/demo/faq.html b/public/themes/website/1/zh/demo/faq.html index 6a14f68..7c0d4f0 100644 --- a/public/themes/website/1/zh/demo/faq.html +++ b/public/themes/website/1/zh/demo/faq.html @@ -68,9 +68,9 @@ - diff --git a/public/themes/website/1/zh/demo/video.html b/public/themes/website/1/zh/demo/video.html index b837033..3c32781 100644 --- a/public/themes/website/1/zh/demo/video.html +++ b/public/themes/website/1/zh/demo/video.html @@ -80,9 +80,9 @@ -