react-toolkits 2.13.10 → 2.13.11

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # react-toolkits
 
+## 2.13.11
+
+### Patch Changes
+
+- 23c7916: Release
+
 ## 2.13.10
 
 ### Patch Changes

package/lib/index.d.ts

@@ -3,6 +3,7 @@ import { FC, PropsWithChildren, Key, ReactNode, ReactElement, Ref, ComponentType
 import { ParagraphProps } from 'antd/es/typography/Paragraph';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { FormInstance, MenuProps, ModalProps, FormProps, ButtonProps } from 'antd';
+import { AnyObject } from 'antd/es/_util/type';
 import { TableProps } from 'antd/es/table';
 import { AxiosHeaderValue, AxiosRequestConfig, AxiosInstance, InternalAxiosRequestConfig, AxiosResponse, AxiosInterceptorOptions } from 'axios';
 import * as swr from 'swr';
@@ -12,7 +13,6 @@ import { Merge } from 'ts-essentials';
 import * as zustand_middleware from 'zustand/middleware';
 import { StateStorage } from 'zustand/middleware';
 import * as zustand from 'zustand';
-import { AnyObject } from 'antd/es/_util/type';
 
 interface DynamicTagsProps {
     initialTags?: string[];
@@ -44,26 +44,31 @@ interface HighlightProps extends PropsWithChildren {
 }
 declare const Highlight: (props: HighlightProps) => react_jsx_runtime.JSX.Element;
 
-interface InfiniteListExtra<Values> {
-    key: Key;
-    children: ReactNode | ((form: FormInstance<Values>) => ReactNode);
+interface InfiniteListRef<Item extends AnyObject = AnyObject, Values = AnyObject, Data = any> {
+    data: Data[] | undefined;
+    dataSource: Item[] | undefined;
+    form: FormInstance<Values>;
 }
-interface InfiniteListProps<Item, Values, Response> extends Pick<TableProps<Item>, 'columns' | 'rowKey' | 'tableLayout' | 'expandable' | 'rowSelection' | 'bordered'> {
+interface InfiniteListProps<Item, Values, Data> extends Pick<TableProps<Item>, 'columns' | 'rowKey' | 'tableLayout' | 'expandable' | 'rowSelection' | 'bordered'>, Pick<FilterFormWrapperProps, 'buttonsAlign' | 'showReset'> {
     url: string;
-    getRowKey: (response: Response) => any;
-    getDataSource: (data: (Response | undefined)[] | undefined) => Item[];
+    getRowKey: (response: Data | undefined) => any;
+    getDataSource: (data: Data[] | undefined) => Item[];
+    form?: FormInstance<Values>;
     code?: string;
     headers?: {
         [key: string]: AxiosHeaderValue;
     } | ((form: FormInstance<Values>) => {
         [key: string]: AxiosHeaderValue;
     });
-    renderForm?: (form: FormInstance<Values>) => ReactNode;
-    transformArg: (values: Values, rowKey?: string) => Record<any, any>;
-    hasMore?: (data: (Response | undefined)[] | undefined) => boolean;
-    extras?: InfiniteListExtra<Values>[];
+    renderForm?: (form: FormInstance<Values>) => ReactElement;
+    params: (values: Values, rowKey?: string) => Record<any, any>;
+    getHasMore?: (data: Data | undefined) => boolean;
+    tableExtra?: ReactNode | ((form: FormInstance<Values>) => ReactNode);
+    footer?: (data: (Data | undefined)[] | undefined) => ReactNode;
 }
-declare const InfiniteList: <Item extends object, Values extends object | undefined = undefined, Response = any>(props: InfiniteListProps<Item, Values, Response>) => react_jsx_runtime.JSX.Element;
+declare const InfiniteList: <Item extends AnyObject = AnyObject, Values extends object | undefined = undefined, Data = any>(props: InfiniteListProps<Item, Values, Data> & {
+    ref?: Ref<InfiniteListRef<Item, Data>>;
+}) => ReactElement;
 
 type Area = 'all' | 'cn' | 'global';
 type ScreenOrientation = 0 | 1;
@@ -477,4 +482,4 @@ declare const SignIn: FC<SignInProps>;
 
 declare const mixedStorage: StateStorage;
 
-export { APP_ID_HEADER, DynamicTags, type DynamicTagsProps, ExpandableParagraph, type ExpandableParagraphProps, FRONTEND_ROUTE_PREFIX, FilterFormWrapper, type FilterFormWrapperProps, type Game, Highlight, type HighlightProps, InfiniteList, type InfiniteListProps, type JsonData, Layout, type LayoutProps, type LayoutState, type MenuListItem, NavMenu, type NavMenuItem, NotFound, _default$1 as OperationLogList, type Permission, PermissionButton, type PermissionButtonProps, PermissionVersion, QueryList, QueryListAction, type QueryListPayload, type QueryListProps, type QueryListRef, RequireGame, RequirePermission, type RequirePermissionProps, SSO_URL, SignIn, ToolkitsProvider, type ToolkitsProviderProps, type UseFormModalProps, UserWidget, WILDCARD, _default$2 as menuRoutes, mixedStorage, _default as permissionRoutes, useFindGame, useFormModal, useGames, useLayoutStore, useMenuList, useModal, useModalStore, usePermission, usePermissions, useQueryListStore, useToolkitsStore, withContext };
+export { APP_ID_HEADER, DynamicTags, type DynamicTagsProps, ExpandableParagraph, type ExpandableParagraphProps, FRONTEND_ROUTE_PREFIX, FilterFormWrapper, type FilterFormWrapperProps, type Game, Highlight, type HighlightProps, InfiniteList, type InfiniteListProps, type InfiniteListRef, type JsonData, Layout, type LayoutProps, type LayoutState, type MenuListItem, NavMenu, type NavMenuItem, NotFound, _default$1 as OperationLogList, type Permission, PermissionButton, type PermissionButtonProps, PermissionVersion, QueryList, QueryListAction, type QueryListPayload, type QueryListProps, type QueryListRef, RequireGame, RequirePermission, type RequirePermissionProps, SSO_URL, SignIn, ToolkitsProvider, type ToolkitsProviderProps, type UseFormModalProps, UserWidget, WILDCARD, _default$2 as menuRoutes, mixedStorage, _default as permissionRoutes, useFindGame, useFormModal, useGames, useLayoutStore, useMenuList, useModal, useModalStore, usePermission, usePermissions, useQueryListStore, useToolkitsStore, withContext };

package/lib/index.js

@@ -3,10 +3,10 @@ import { jwtDecode } from 'jwt-decode';
 import { useStore, create, createStore } from 'zustand';
 import { persist, createJSONStorage } from 'zustand/middleware';
 import * as Antd2 from 'antd';
-import { Modal, Form, Card, Input, Select, theme, Space, Tag, Typography, Spin, Result, Table, Button, Alert, Divider, Menu, App, Switch, InputNumber, Row, Col, Breadcrumb, Descriptions, Skeleton, Empty, Dropdown, Tooltip, Popconfirm, Collapse, Checkbox } from 'antd';
-import { lazy, useContext, useMemo, useState, useRef, useEffect, createContext, memo, useCallback, forwardRef, Fragment as Fragment$1, Suspense, useImperativeHandle, cloneElement } from 'react';
+import { Modal, Form, Spin, Result, Table, Button, Card, Input, Select, theme, Space, Tag, Typography, Alert, Divider, Menu, App, Switch, InputNumber, Row, Col, Breadcrumb, Descriptions, Skeleton, Empty, Dropdown, Tooltip, Popconfirm, Collapse, Checkbox } from 'antd';
+import { forwardRef, lazy, useContext, useMemo, useState, useEffect, useImperativeHandle, cloneElement, useRef, createContext, memo, useCallback, Fragment as Fragment$1, Suspense } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { has, template, get, isEqual, last, first } from 'lodash-es';
+import { last, has, template, get, isEqual, first } from 'lodash-es';
 import { flushSync } from 'react-dom';
 import { createRoot } from 'react-dom/client';
 import useSWR5, { mutate, unstable_serialize } from 'swr';
@@ -518,19 +518,16 @@ var init_highlight = __esm({
   }
 });
 function useMenuList() {
-  const { signInPath, axios: axios2, token, gameId } = useToolkitsStore((s) => s);
+  const { signInPath, axios: axios2 } = useToolkitsStore((s) => s);
   return useSWR5(
-    window.location.pathname !== signInPath ? ["/api/usystem/menu/navbar", gameId] : null,
-    ([url4]) => axios2(url4, {
-      headers: { Authorization: `Bearer ${token}`, [APP_ID_HEADER]: gameId }
-    }).then((response) => response.data.data)
+    window.location.pathname !== signInPath ? "/api/usystem/menu/navbar" : null,
+    ([url4]) => axios2(url4).then((response) => response.data.data)
   );
 }
 var usePermissions, usePermission;
 var init_hooks2 = __esm({
   "src/hooks/index.ts"() {
     init_toolkitsProvider();
-    init_constants();
     usePermissions = (codes = [], config) => {
       const { axios: axios2, permissionVersion } = useToolkitsStore((s) => s);
       const { data, ...rest } = useSWR5(
@@ -2684,7 +2681,9 @@ var init_userDetail = __esm({
           title: t("global.projectGroup"),
           dataIndex: "game_group",
           render(value) {
-            return value.map((item) => /* @__PURE__ */ jsx(Tag, { children: item }, item));
+            return value.map((item) => {
+              return /* @__PURE__ */ jsx(Tag, { children: item === WILDCARD ? "\u901A\u7528" : item }, item);
+            });
           }
         },
         {
@@ -3159,27 +3158,43 @@ init_hooks2();
 init_filterFormWrapper();
 init_locale();
 init_toolkitsProvider();
-var InfiniteList = (props) => {
-  const { code, url: url4, extras, headers, getRowKey, getDataSource, hasMore, renderForm, transformArg, ...tableProps } = props;
+var InternalInfiniteList = (props, ref) => {
+  const {
+    code,
+    url: url4,
+    tableExtra,
+    headers,
+    getRowKey,
+    getDataSource,
+    getHasMore,
+    renderForm,
+    params,
+    footer,
+    form,
+    buttonsAlign,
+    showReset,
+    ...tableProps
+  } = props;
   const { t } = useTranslation();
-  const [form] = Form.useForm();
+  const [_form] = Form.useForm(form);
   const [isValid, setIsValid] = useState(false);
   const [formValues, setFormValues] = useState();
   const { axios: axios2 } = useToolkitsStore((s) => s);
   const getKey = (pageIndex, previousPageData) => {
     if (!isValid) return null;
     const rowKey = pageIndex !== 0 ? getRowKey(previousPageData) : void 0;
-    const args = transformArg(formValues, rowKey);
+    const args = params(formValues, rowKey);
     const queryString = qs.stringify(args);
     return queryString ? `${url4}?${qs.stringify(args)}` : url4;
   };
-  const _headers = typeof headers === "function" ? headers(form) : headers;
+  const _headers = typeof headers === "function" ? headers(_form) : headers;
   const { accessible, isLoading } = usePermission(code);
   const {
     data,
     size,
     setSize,
-    isValidating: isListValidating
+    isValidating: isListValidating,
+    mutate: mutate2
   } = useSWRInfinite(
     getKey,
     async (arg) => {
@@ -3194,15 +3209,16 @@ var InfiniteList = (props) => {
   );
   const dataSource = getDataSource(data);
   const isLoadingMore = isListValidating || size > 0 && data && typeof data[size - 1] === "undefined";
-  const isReachingEnd = typeof hasMore !== "undefined" ? !hasMore(data) : true;
+  const isReachingEnd = typeof getHasMore !== "undefined" ? !getHasMore(last(data)) : true;
   const isEmpty = !dataSource || dataSource.length === 0;
   const onConfirm = async () => {
-    const values = await form.getFieldsValue();
+    const values = await _form.getFieldsValue();
     setFormValues(values);
     try {
-      await form.validateFields();
-      setSize(1);
+      await _form.validateFields();
       setIsValid(true);
+      setSize(1);
+      mutate2();
     } catch (_) {
       setSize(0);
       setIsValid(false);
@@ -3213,23 +3229,30 @@ var InfiniteList = (props) => {
   };
   const onReset = async () => {
     try {
-      form.resetFields();
-      await form.validateFields({ validateOnly: true });
+      _form.resetFields();
+      await _form.validateFields({ validateOnly: true });
       setSize(1);
     } catch (error) {
       setSize(0);
     }
   };
   useEffect(() => {
-    if (accessible) {
-      form.validateFields({ validateOnly: true }).then((values) => {
-        setFormValues(values);
-        setIsValid(true);
-      }).catch(() => {
-        setIsValid(false);
-      });
-    }
+    setTimeout(() => {
+      if (accessible) {
+        _form.validateFields({ validateOnly: true }).then((values) => {
+          setFormValues(values);
+          setIsValid(true);
+        }).catch(() => {
+          setIsValid(false);
+        });
+      }
+    }, 300);
   }, [accessible]);
+  useImperativeHandle(ref, () => ({
+    data,
+    dataSource,
+    form: _form
+  }));
   if (isLoading) {
     return /* @__PURE__ */ jsx(
       Spin,
@@ -3246,20 +3269,31 @@ var InfiniteList = (props) => {
   if (!accessible) {
     return /* @__PURE__ */ jsx(Result, { status: 403, subTitle: t("global.noEntitlement") });
   }
+  const renderFooter = footer && (() => footer(data));
+  const formRenderer = typeof renderForm === "function" ? /* @__PURE__ */ jsx(
+    FilterFormWrapper_default,
+    {
+      showReset,
+      buttonsAlign,
+      isConfirming: isListValidating,
+      onReset,
+      onConfirm,
+      children: cloneElement(renderForm(_form), {
+        onKeyUp: (e) => {
+          if (e.key === "Enter") {
+            onConfirm();
+          }
+        }
+      })
+    }
+  ) : (
+    // 屏蔽 Form 组件的警告（Instance created by `useForm` is not connected to any Form element. Forget to pass `form` prop?）
+    /* @__PURE__ */ jsx(Form, { form: _form })
+  );
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    renderForm ? /* @__PURE__ */ jsx(
-      FilterFormWrapper_default,
-      {
-        extras: extras?.map((extra) => ({
-          key: extra.key,
-          children: typeof extra.children === "function" ? extra.children(form) : extra.children
-        })),
-        onReset,
-        onConfirm,
-        children: renderForm(form)
-      }
-    ) : /* @__PURE__ */ jsx(Form, { form }),
-    /* @__PURE__ */ jsx(Table, { ...tableProps, dataSource, loading: isLoadingMore, pagination: false }),
+    formRenderer,
+    typeof tableExtra === "function" ? tableExtra(_form) : tableExtra,
+    /* @__PURE__ */ jsx(Table, { ...tableProps, dataSource, loading: isLoadingMore, pagination: false, footer: renderFooter }),
     !isEmpty && /* @__PURE__ */ jsx(
       Button,
       {
@@ -3274,6 +3308,7 @@ var InfiniteList = (props) => {
     )
   ] });
 };
+var InfiniteList = forwardRef(InternalInfiniteList);
 var InfiniteList_default = InfiniteList;
 
 // src/index.ts