feat(search): 服务支持tab搜索优化

public/themes/dist_static/static/js/announce.js

@@ -41,6 +41,13 @@ function initFilterDropdown() {
 			$btn.addClass("is-selected");
 		}
 		closeDropdown();
+		const params = new URLSearchParams();
+		const keywords = $("[data-tab-search] [name='keywords']").val().trim();
+		const tabId = $item.attr("data-tab") || "";
+		if (tabId) params.set("cid", tabId);
+		if (keywords) params.set("keywords", keywords);
+		const query = params.toString();
+		window.location.href = query ? `${window.location.pathname}?${query}` : window.location.pathname;
 	});
 	$(document).on("click", function(event) {
 		if (!$(event.target).closest("[data-filter-trigger], [data-filter-dropdown]").length) closeDropdown();

public/themes/dist_static/static/js/download.js

@@ -36,6 +36,12 @@ $(function() {
 		const query = params.toString();
 		return query ? `${window.location.pathname}?${query}` : window.location.pathname;
 	};
+	const runSearch = (tabId = getActiveTabId()) => {
+		window.location.href = buildQueryUrl({
+			tabId,
+			keywords: getKeywords()
+		});
+	};
 	const activateTabById = (tabId) => {
 		if (!tabId) return;
 		const $dropdownItem = $(`.d-tabs__dropdown-item[data-tab="${tabId}"]`).first();
@@ -55,6 +61,7 @@ $(function() {
 		$(".d-tabs__dropdown-item").removeClass("is-active");
 		activateTab($(this));
 		closeDropdowns();
+		runSearch($(this).attr("data-tab") || "");
 	});
 	$("[data-dropdown-trigger]").on("click", function() {
 		const $btn = $(this);
@@ -74,16 +81,14 @@ $(function() {
 		$trigger.find("span").text($item.text());
 		activateTab($trigger);
 		closeDropdowns();
+		runSearch($item.attr("data-tab") || "");
 	});
 	$(document).on("click", function(event) {
 		if (!$(event.target).closest(".d-tabs__group").length) closeDropdowns();
 	});
 	$("[data-tab-search]").on("submit", function(event) {
 		event.preventDefault();
-		window.location.href = buildQueryUrl({
-			tabId: getActiveTabId(),
-			keywords: $(this).find('[name="keywords"]').val().trim()
-		});
+		runSearch();
 	});
 	const searchParams = new URLSearchParams(window.location.search);
 	const tabParam = searchParams.get("cid");

public/themes/dist_static/static/js/faq.js

@@ -22,15 +22,21 @@ function activateTabById(tabId) {
 	if ($target.length) activateFaqTab($target);
 }
 function initTabKeywordsSearch() {
-	$("[data-tab-search]").on("submit", function(event) {
-		event.preventDefault();
+	const runSearch = (tabId = getActiveTabId()) => {
 		const params = new URLSearchParams();
-		const keywords = $(this).find('[name="keywords"]').val().trim();
-		const tabId = getActiveTabId();
+		const keywords = $("[data-tab-search] [name='keywords']").val().trim();
 		if (tabId) params.set("cid", tabId);
 		if (keywords) params.set("keywords", keywords);
 		const query = params.toString();
 		window.location.href = query ? `${window.location.pathname}?${query}` : window.location.pathname;
+	};
+	$("[data-tab-search]").on("submit", function(event) {
+		event.preventDefault();
+		runSearch();
+	});
+	$(".f-tabs__item").on("click", function() {
+		activateFaqTab($(this));
+		runSearch($(this).attr("data-tab") || "");
 	});
 	const searchParams = new URLSearchParams(window.location.search);
 	const tabParam = searchParams.get("cid");
@@ -40,9 +46,6 @@ function initTabKeywordsSearch() {
 }
 $(function() {
 	setActiveNav();
-	$(".f-tabs__item").on("click", function() {
-		activateFaqTab($(this));
-	});
 	$(".f-item__trigger").on("click", function() {
 		const $item = $(this).closest(".f-item");
 		const willOpen = !$item.hasClass("is-open");

public/themes/dist_static/static/js/video.js

@@ -82,6 +82,13 @@ function initFilterDropdown() {
 			$btn.addClass("is-selected");
 		}
 		closeDropdown();
+		const params = new URLSearchParams();
+		const keywords = $("[data-tab-search] [name='keywords']").val().trim();
+		const tabId = $item.attr("data-tab") || "";
+		if (tabId) params.set("cid", tabId);
+		if (keywords) params.set("keywords", keywords);
+		const query = params.toString();
+		window.location.href = query ? `${window.location.pathname}?${query}` : window.location.pathname;
 	});
 	$(document).on("click", function(event) {
 		if (!$(event.target).closest("[data-filter-trigger], [data-filter-dropdown]").length) closeDropdown();

public/themes/website/1/en/demo/announce.html

@@ -64,23 +64,42 @@
       </div>
 
       <div class="a-toolbar">
+        {php}
+          $filter_cid = (string)input('cid', '');
+          $filter_all_id = (string)($current_cate['id'] ?? '');
+          if ($filter_cid === '') {
+            $filter_cid = $filter_all_id;
+          }
+          $filter_keywords = (string)input('keywords', '');
+          $filter_is_all = ($filter_cid === $filter_all_id);
+          $filter_label = 'Filter by product';
+          if (!$filter_is_all && !empty($sub_cates)) {
+            foreach ($sub_cates as $sc) {
+              if ((string)($sc['id'] ?? '') === $filter_cid) {
+                $filter_label = $sc['title'] ?? $filter_label;
+                break;
+              }
+            }
+          }
+        {/php}
         <div class="a-filter__group">
-          <button type="button" class="a-filter" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
-            <span>Filter by product</span>
+          <button type="button" class="a-filter{if !$filter_is_all} is-selected{/if}" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
+            <span>{$filter_label}</span>
             <svg class="a-filter__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
               <path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
             </svg>
           </button>
           <div class="a-filter__dropdown" data-filter-dropdown hidden>
-            <button type="button" class="a-filter__dropdown-item is-active" data-tab="{$current_cate.id}" data-filter-clear>All</button>
+            <button type="button" class="a-filter__dropdown-item{if $filter_is_all} is-active{/if}" data-tab="{$current_cate.id}" data-filter-clear>All</button>
             {volist name="sub_cates" id="vo"}
-            <button type="button" class="a-filter__dropdown-item" data-tab="{$vo.id}">{$vo.title}</button>
+            {php}$vo_id = (string)($vo['id'] ?? '');{/php}
+            <button type="button" class="a-filter__dropdown-item{if $filter_cid == $vo_id} is-active{/if}" data-tab="{$vo.id}">{$vo.title}</button>
             {/volist}
           </div>
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="Search notice keywords" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$filter_keywords}" placeholder="Search notice keywords" autocomplete="off" />
           <button class="s-search__btn" type="submit">Search</button>
         </form>
       </div>

public/themes/website/1/en/demo/download.html

@@ -67,21 +67,34 @@
         <div class="d-tabs" role="tablist" aria-label="Resource categories">
           {php}
           $download_cid = (string)input('cid', '');
+          $download_all_id = (string)($current_cate['id'] ?? '');
           if ($download_cid === '') {
-            $download_cid = (string)($current_cate['id'] ?? '');
+            $download_cid = $download_all_id;
           }
-          $download_all_id = (string)($current_cate['id'] ?? '');
+          $download_keywords = (string)input('keywords', '');
           {/php}
           <button type="button" class="d-tabs__item{if $download_cid == $download_all_id} is-active{/if}" role="tab" data-tab="{$current_cate.id}" aria-selected="{if $download_cid == $download_all_id}true{else /}false{/if}">All</button>
           {volist name="sub_cates" id="vo"}
           {php}
           $count = getCategoryChildrenCount($vo['id']);
           $vo_id = (string)($vo['id'] ?? '');
+          $group_active = false;
+          $group_label = $vo['title'] ?? '';
+          if ($count > 0) {
+            $group_children = (new \app\model\Category())->where('parent_id', $vo['id'])->field('id,title')->select()->toArray();
+            foreach ($group_children as $gc) {
+              if ((string)($gc['id'] ?? '') === $download_cid) {
+                $group_active = true;
+                $group_label = $gc['title'] ?? $group_label;
+                break;
+              }
+            }
+          }
           {/php}
           {if $count > 0}
           <div class="d-tabs__group">
-            <button type="button" class="d-tabs__item" role="tab" aria-selected="false" aria-expanded="false" data-dropdown-trigger data-tab="{$vo.id}">
-              <span>{$vo.title}</span>
+            <button type="button" class="d-tabs__item{if $group_active} is-active{/if}" role="tab" aria-selected="{if $group_active}true{else /}false{/if}" aria-expanded="false" data-dropdown-trigger data-tab="{$vo.id}">
+              <span>{$group_label}</span>
               <svg class="d-tabs__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
                 <path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
               </svg>
@@ -99,7 +112,7 @@
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="Search files to download" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$download_keywords}" placeholder="Search files to download" autocomplete="off" />
           <button class="s-search__btn" type="submit">Search</button>
         </form>
       </div>

public/themes/website/1/en/demo/faq.html

@@ -64,15 +64,24 @@
       </div>
 
       <div class="f-toolbar">
+        {php}
+          $filter_cid = (string)input('cid', '');
+          $filter_all_id = (string)($current_cate['id'] ?? '');
+          if ($filter_cid === '') {
+            $filter_cid = $filter_all_id;
+          }
+          $filter_keywords = (string)input('keywords', '');
+        {/php}
         <div class="f-tabs" role="tablist" aria-label="FAQ categories">
-          <button type="button" class="f-tabs__item is-active" role="tab" data-tab="{$current_cate.id}" aria-selected="true">All</button>
+          <button type="button" class="f-tabs__item{if $filter_cid == $filter_all_id} is-active{/if}" role="tab" data-tab="{$current_cate.id}" aria-selected="{if $filter_cid == $filter_all_id}true{else /}false{/if}">All</button>
           {volist name="sub_cates" id="vo"}
-          <button type="button" class="f-tabs__item" role="tab" data-tab="{$vo.id}" aria-selected="false">{$vo.title}</button>
+          {php}$vo_id = (string)($vo['id'] ?? '');{/php}
+          <button type="button" class="f-tabs__item{if $filter_cid == $vo_id} is-active{/if}" role="tab" data-tab="{$vo.id}" aria-selected="{if $filter_cid == $vo_id}true{else /}false{/if}">{$vo.title}</button>
           {/volist}
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="Search FAQ keywords" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$filter_keywords}" placeholder="Search FAQ keywords" autocomplete="off" />
           <button class="s-search__btn" type="submit">Search</button>
         </form>
       </div>

public/themes/website/1/en/demo/video.html

@@ -64,23 +64,42 @@
       </div>
 
       <div class="v-toolbar">
+        {php}
+          $filter_cid = (string)input('cid', '');
+          $filter_all_id = (string)($current_cate['id'] ?? '');
+          if ($filter_cid === '') {
+            $filter_cid = $filter_all_id;
+          }
+          $filter_keywords = (string)input('keywords', '');
+          $filter_is_all = ($filter_cid === $filter_all_id);
+          $filter_label = 'Filter by product';
+          if (!$filter_is_all && !empty($sub_cates)) {
+            foreach ($sub_cates as $sc) {
+              if ((string)($sc['id'] ?? '') === $filter_cid) {
+                $filter_label = $sc['title'] ?? $filter_label;
+                break;
+              }
+            }
+          }
+        {/php}
         <div class="v-filter__group">
-          <button type="button" class="v-filter" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
-            <span>Filter by product</span>
+          <button type="button" class="v-filter{if !$filter_is_all} is-selected{/if}" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
+            <span>{$filter_label}</span>
             <svg class="v-filter__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
               <path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
             </svg>
           </button>
           <div class="v-filter__dropdown" data-filter-dropdown hidden>
-            <button type="button" class="v-filter__dropdown-item is-active" data-tab="{$current_cate.id}" data-filter-clear>All</button>
+            <button type="button" class="v-filter__dropdown-item{if $filter_is_all} is-active{/if}" data-tab="{$current_cate.id}" data-filter-clear>All</button>
             {volist name="sub_cates" id="vo"}
-            <button type="button" data-tab="{$vo.id}" class="v-filter__dropdown-item">{$vo.title}</button>
+            {php}$vo_id = (string)($vo['id'] ?? '');{/php}
+            <button type="button" data-tab="{$vo.id}" class="v-filter__dropdown-item{if $filter_cid == $vo_id} is-active{/if}">{$vo.title}</button>
             {/volist}
           </div>
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="Search video keywords" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$filter_keywords}" placeholder="Search video keywords" autocomplete="off" />
           <button class="s-search__btn" type="submit">Search</button>
         </form>
       </div>

public/themes/website/1/zh/demo/announce.html

@@ -64,23 +64,42 @@
       </div>
 
       <div class="a-toolbar">
+        {php}
+          $filter_cid = (string)input('cid', '');
+          $filter_all_id = (string)($current_cate['id'] ?? '');
+          if ($filter_cid === '') {
+            $filter_cid = $filter_all_id;
+          }
+          $filter_keywords = (string)input('keywords', '');
+          $filter_is_all = ($filter_cid === $filter_all_id);
+          $filter_label = '按产品筛选';
+          if (!$filter_is_all && !empty($sub_cates)) {
+            foreach ($sub_cates as $sc) {
+              if ((string)($sc['id'] ?? '') === $filter_cid) {
+                $filter_label = $sc['title'] ?? $filter_label;
+                break;
+              }
+            }
+          }
+        {/php}
         <div class="a-filter__group">
-          <button type="button" class="a-filter" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
-            <span>按产品筛选</span>
+          <button type="button" class="a-filter{if !$filter_is_all} is-selected{/if}" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
+            <span>{$filter_label}</span>
             <svg class="a-filter__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
               <path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
             </svg>
           </button>
           <div class="a-filter__dropdown" data-filter-dropdown hidden>
-            <button type="button" class="a-filter__dropdown-item is-active" data-tab="{$current_cate.id}" data-filter-clear>全部</button>
+            <button type="button" class="a-filter__dropdown-item{if $filter_is_all} is-active{/if}" data-tab="{$current_cate.id}" data-filter-clear>全部</button>
             {volist name="sub_cates" id="vo"}
-            <button type="button" class="a-filter__dropdown-item" data-tab="{$vo.id}">{$vo.title}</button>
+            {php}$vo_id = (string)($vo['id'] ?? '');{/php}
+            <button type="button" class="a-filter__dropdown-item{if $filter_cid == $vo_id} is-active{/if}" data-tab="{$vo.id}">{$vo.title}</button>
             {/volist}
           </div>
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="请输入您想搜索公告的关键词" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$filter_keywords}" placeholder="请输入您想搜索公告的关键词" autocomplete="off" />
           <button class="s-search__btn" type="submit">搜索</button>
         </form>
       </div>

public/themes/website/1/zh/demo/download.html

@@ -67,21 +67,34 @@
         <div class="d-tabs" role="tablist" aria-label="资料分类">
           {php}
           $download_cid = (string)input('cid', '');
+          $download_all_id = (string)($current_cate['id'] ?? '');
           if ($download_cid === '') {
-            $download_cid = (string)($current_cate['id'] ?? '');
+            $download_cid = $download_all_id;
           }
-          $download_all_id = (string)($current_cate['id'] ?? '');
+          $download_keywords = (string)input('keywords', '');
           {/php}
           <button type="button" class="d-tabs__item{if $download_cid == $download_all_id} is-active{/if}" role="tab" data-tab="{$current_cate.id}" aria-selected="{if $download_cid == $download_all_id}true{else /}false{/if}">全部</button>
           {volist name="sub_cates" id="vo"}
           {php}
           $count = getCategoryChildrenCount($vo['id']);
           $vo_id = (string)($vo['id'] ?? '');
+          $group_active = false;
+          $group_label = $vo['title'] ?? '';
+          if ($count > 0) {
+            $group_children = (new \app\model\Category())->where('parent_id', $vo['id'])->field('id,title')->select()->toArray();
+            foreach ($group_children as $gc) {
+              if ((string)($gc['id'] ?? '') === $download_cid) {
+                $group_active = true;
+                $group_label = $gc['title'] ?? $group_label;
+                break;
+              }
+            }
+          }
           {/php}
           {if $count > 0}
           <div class="d-tabs__group">
-            <button type="button" class="d-tabs__item" role="tab" aria-selected="false" aria-expanded="false" data-dropdown-trigger data-tab="{$vo.id}">
-              <span>{$vo.title}</span>
+            <button type="button" class="d-tabs__item{if $group_active} is-active{/if}" role="tab" aria-selected="{if $group_active}true{else /}false{/if}" aria-expanded="false" data-dropdown-trigger data-tab="{$vo.id}">
+              <span>{$group_label}</span>
               <svg class="d-tabs__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
                 <path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
               </svg>
@@ -99,7 +112,7 @@
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="请输入您想下载的文件" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$download_keywords}" placeholder="请输入您想下载的文件" autocomplete="off" />
           <button class="s-search__btn" type="submit">搜索</button>
         </form>
       </div>

public/themes/website/1/zh/demo/faq.html

@@ -64,15 +64,24 @@
       </div>
 
       <div class="f-toolbar">
+        {php}
+          $filter_cid = (string)input('cid', '');
+          $filter_all_id = (string)($current_cate['id'] ?? '');
+          if ($filter_cid === '') {
+            $filter_cid = $filter_all_id;
+          }
+          $filter_keywords = (string)input('keywords', '');
+        {/php}
         <div class="f-tabs" role="tablist" aria-label="问题分类">
-          <button type="button" class="f-tabs__item is-active" role="tab" data-tab="{$current_cate.id}" aria-selected="true">全部</button>
+          <button type="button" class="f-tabs__item{if $filter_cid == $filter_all_id} is-active{/if}" role="tab" data-tab="{$current_cate.id}" aria-selected="{if $filter_cid == $filter_all_id}true{else /}false{/if}">全部</button>
           {volist name="sub_cates" id="vo"}
-          <button type="button" class="f-tabs__item" role="tab" data-tab="{$vo.id}" aria-selected="false">{$vo.title}</button>
+          {php}$vo_id = (string)($vo['id'] ?? '');{/php}
+          <button type="button" class="f-tabs__item{if $filter_cid == $vo_id} is-active{/if}" role="tab" data-tab="{$vo.id}" aria-selected="{if $filter_cid == $vo_id}true{else /}false{/if}">{$vo.title}</button>
           {/volist}
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="请输入您想搜索问题的关键词" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$filter_keywords}" placeholder="请输入您想搜索问题的关键词" autocomplete="off" />
           <button class="s-search__btn" type="submit">搜索</button>
         </form>
       </div>

public/themes/website/1/zh/demo/video.html

@@ -64,23 +64,42 @@
       </div>
 
       <div class="v-toolbar">
+        {php}
+          $filter_cid = (string)input('cid', '');
+          $filter_all_id = (string)($current_cate['id'] ?? '');
+          if ($filter_cid === '') {
+            $filter_cid = $filter_all_id;
+          }
+          $filter_keywords = (string)input('keywords', '');
+          $filter_is_all = ($filter_cid === $filter_all_id);
+          $filter_label = '按产品筛选';
+          if (!$filter_is_all && !empty($sub_cates)) {
+            foreach ($sub_cates as $sc) {
+              if ((string)($sc['id'] ?? '') === $filter_cid) {
+                $filter_label = $sc['title'] ?? $filter_label;
+                break;
+              }
+            }
+          }
+        {/php}
         <div class="v-filter__group">
-          <button type="button" class="v-filter" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
-            <span>按产品筛选</span>
+          <button type="button" class="v-filter{if !$filter_is_all} is-selected{/if}" aria-haspopup="listbox" aria-expanded="false" data-filter-trigger>
+            <span>{$filter_label}</span>
             <svg class="v-filter__chevron" viewBox="0 0 11.2728 6.90918" width="11" height="7" fill="none" aria-hidden="true">
               <path d="M0.636353 0.636272L5.63635 5.63627L10.6364 0.63623" stroke="currentColor" stroke-width="1.8" />
             </svg>
           </button>
           <div class="v-filter__dropdown" data-filter-dropdown hidden>
-            <button type="button" class="v-filter__dropdown-item is-active" data-tab="{$current_cate.id}" data-filter-clear>全部</button>
+            <button type="button" class="v-filter__dropdown-item{if $filter_is_all} is-active{/if}" data-tab="{$current_cate.id}" data-filter-clear>全部</button>
             {volist name="sub_cates" id="vo"}
-            <button type="button" data-tab="{$vo.id}" class="v-filter__dropdown-item">{$vo.title}</button>
+            {php}$vo_id = (string)($vo['id'] ?? '');{/php}
+            <button type="button" data-tab="{$vo.id}" class="v-filter__dropdown-item{if $filter_cid == $vo_id} is-active{/if}">{$vo.title}</button>
             {/volist}
           </div>
         </div>
         <form class="s-search" role="search" data-tab-search>
           <img class="s-search__icon" src="data:image/svg+xml,%3csvg%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='24.000000'%20height='24.000000'%20fill='none'%3e%3crect%20id='搜索'%20width='24.000000'%20height='24.000000'%20x='0.000000'%20y='0.000000'%20fill='rgb(255,255,255)'%20fill-opacity='0'%20/%3e%3cpath%20id='矢量%203'%20d='M15.8481%2017.1208C14.4808%2018.2114%2012.7482%2018.8633%2010.8633%2018.8633C6.44506%2018.8633%202.86328%2015.2816%202.86328%2010.8633C2.86328%206.445%206.44506%202.86328%2010.8633%202.86328C15.2815%202.86328%2018.8633%206.445%2018.8633%2010.8633C18.8633%2012.7482%2018.2114%2014.4808%2017.1208%2015.8481L21.136%2019.8633L19.8633%2021.136L15.8481%2017.1208ZM17.0632%2010.8633C17.0632%207.43908%2014.2874%204.66326%2010.8633%204.66326C7.4392%204.66326%204.66332%207.43908%204.66332%2010.8633C4.66332%2014.2875%207.4392%2017.0633%2010.8633%2017.0633C14.2874%2017.0633%2017.0632%2014.2875%2017.0632%2010.8633Z'%20fill='rgb(175,181,185)'%20fill-rule='evenodd'%20/%3e%3c/svg%3e" alt="" width="24" height="24" />
-          <input class="s-search__input" type="search" name="keywords" placeholder="请输入您想搜索视频的关键词" autocomplete="off" />
+          <input class="s-search__input" type="search" name="keywords" value="{$filter_keywords}" placeholder="请输入您想搜索视频的关键词" autocomplete="off" />
           <button class="s-search__btn" type="submit">搜索</button>
         </form>
       </div>