fix: fix `IconPicker` reporting an error when using search if no icon is found (#6944)

* 修复未搜索图标时分页报错的问题
 * 优化`IconPicker` 的分页逻辑，由total触发跳转到第一页，而不是用户控制

packages/effects/common-ui/src/components/icon-picker/icon-picker.vue

@@ -71,17 +71,10 @@ const modelValue = defineModel({ default: '', type: String });
 
 const visible = ref(false);
 const currentSelect = ref('');
-const currentPage = ref(1);
 const keyword = ref('');
 const keywordDebounce = refDebounced(keyword, 300);
 const innerIcons = ref<string[]>([]);
 
-/* 当检索关键词变化时，重置分页 */
-watch(keywordDebounce, () => {
-  currentPage.value = 1;
-  setCurrentPage(1);
-});
-
 watchDebounced(
   () => props.prefix,
   async (prefix) => {
@@ -122,7 +115,7 @@ const showList = computed(() => {
   );
 });
 
-const { paginationList, total, setCurrentPage } = usePagination(
+const { paginationList, total, setCurrentPage, currentPage } = usePagination(
   showList,
   props.pageSize,
 );
@@ -145,7 +138,6 @@ const handleClick = (icon: string) => {
 };
 
 const handlePageChange = (page: number) => {
-  currentPage.value = page;
   setCurrentPage(page);
 };
 

packages/effects/hooks/src/use-pagination.ts

@@ -1,6 +1,6 @@
 import type { Ref } from 'vue';
 
-import { computed, ref, unref } from 'vue';
+import { computed, ref, unref, watch } from 'vue';
 
 /**
  * Paginates an array of items
@@ -22,7 +22,11 @@ function pagination<T = any>(list: T[], pageNo: number, pageSize: number): T[] {
   return ret;
 }
 
-export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
+export function usePagination<T = any>(
+  list: Ref<T[]>,
+  pageSize: number,
+  totalChangeToFirstPage = true,
+) {
   const currentPage = ref(1);
   const pageSizeRef = ref(pageSize);
 
@@ -38,11 +42,21 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
     return unref(list).length;
   });
 
+  if (totalChangeToFirstPage) {
+    watch(total, () => {
+      setCurrentPage(1);
+    });
+  }
+
   function setCurrentPage(page: number) {
-    if (page < 1 || page > unref(totalPages)) {
-      throw new Error('Invalid page number');
+    if (page === 1 && unref(totalPages) === 0) {
+      currentPage.value = 1;
+    } else {
+      if (page < 1 || page > unref(totalPages)) {
+        throw new Error('Invalid page number');
+      }
+      currentPage.value = page;
     }
-    currentPage.value = page;
   }
 
   function setPageSize(pageSize: number) {
@@ -54,5 +68,5 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
     currentPage.value = 1;
   }
 
-  return { setCurrentPage, total, setPageSize, paginationList };
+  return { setCurrentPage, total, setPageSize, paginationList, currentPage };
 }