beer-assembly-biz 1.1.1-alpha.9 → 1.1.2-alpha.10

package/AppLayout.d.ts

@@ -78,6 +78,14 @@ export declare type LayoutProps = {
      * 子路径路径分割符号, 用去区分是否子路径判断子路径的菜单归属
      */
     pathPartition: string[];
+    /**
+     * 请求获取用户信息
+     */
+    requestUser: () => Promise<UserInfo>;
+    /**
+     * 登录页面.
+     */
+    authPath?: string;
     /**
      * 左侧: Logo样式
      */
@@ -90,6 +98,10 @@ export declare type LayoutProps = {
          * 高度
          */
         height?: number;
+        /**
+         * 跳转路径
+         */
+        link?: string;
     };
     /**
      * 右侧: 用户下拉选菜单
@@ -97,7 +109,7 @@ export declare type LayoutProps = {
     userMenus?: {
         key: string;
         type?: string;
-        label: string;
+        label: ReactNode;
     }[];
     /**
      * 头部: 从右到左菜单
@@ -108,10 +120,6 @@ export declare type LayoutProps = {
      * @param path 路径.
      */
     toLink?: (path: string) => void;
-    /**
-     * 请求获取用户信息
-     */
-    requestUser?: () => Promise<UserInfo>;
     /**
      * 请求获取菜单信息
      * @param appCode 应用代码

package/AppLayout.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { css } from '@emotion/css';
-import { ProConfigProvider, ProLayout } from '@ant-design/pro-components';
-import { Dropdown, message, Typography } from 'antd';
+import { ProLayout } from '@ant-design/pro-components';
+import { Dropdown, message, theme, Typography } from 'antd';
 import { Session } from 'beer-network/session';
 import dayjs from 'dayjs';
 import ImageLayout01 from './images/layout_01.png';
@@ -9,6 +9,7 @@ import ImageLayout02 from './images/layout_02.png';
 import ImageLayout03 from './images/layout_03.png';
 dayjs.locale('zh-cn');
 const Component = (props) => {
+    const { token } = theme.useToken();
     const [messageApi, contextHolder] = message.useMessage();
     // App
     const [app, setApp] = useState({});
@@ -16,6 +17,8 @@ const Component = (props) => {
     const [userInfo, setUserInfo] = useState();
     // 菜单是否折叠
     const [collapsed, setCollapsed] = useState(false);
+    // 是否是手机号
+    const [isMobile, setIsMobile] = useState(false);
     // 菜单的选择
     const [pathKeys, setPathKeys] = useState([]);
     // 获取参数参数
@@ -84,7 +87,7 @@ const Component = (props) => {
         messageApi.success('退出登录成功！')
             .then();
         setTimeout(() => {
-            Session.logout('/auth/login');
+            Session.logout(props?.authPath || '/auth/login');
         }, 800);
     };
     // 更新属性触发: 应用
@@ -99,8 +102,8 @@ const Component = (props) => {
     }, [menus, props.path]);
     // 更新属性触发: 请求用户信息
     useEffect(() => {
-        props?.requestUser?.()
-            ?.then(userInfo => {
+        props.requestUser()
+            .then(userInfo => {
             // 更新缓存到Session
             if (userInfo === undefined || userInfo?.id === undefined) {
                 return;
@@ -108,10 +111,10 @@ const Component = (props) => {
             setUserInfo(userInfo);
             sessionStorage.setItem('SESSION', JSON.stringify(userInfo));
         });
-    }, [props?.requestUser]);
-    return React.createElement(ProConfigProvider, { hashed: false },
+    }, []);
+    return React.createElement(React.Fragment, null,
         contextHolder,
-        React.createElement(ProLayout, { className: css `
+        React.createElement(ProLayout, { theme: "light", className: css `
           .ant-pro-sider-logo {
               .ant-pro-layout-apps-icon {
                   display: ${collapsed ? 'flex' : 'none'};
@@ -134,7 +137,7 @@ const Component = (props) => {
               padding: 3px;
 
               & > div {
-                  height: 36px;
+                  height: ${token.controlHeight + 2}px;
                   line-height: 1.5;
               }
           }
@@ -175,18 +178,21 @@ const Component = (props) => {
                     heightLayoutHeader: 48
                 },
                 sider: {
-                    menuHeight: 32,
+                    menuHeight: token.controlHeight + 2,
                     paddingBlockLayoutMenu: 4,
                     paddingInlineLayoutMenu: 4,
                     colorMenuBackground: '#fff',
                     colorTextMenu: 'rgb(87, 89, 102)',
+                    colorTextMenuSelected: 'rgba(0,0,0,0.8)',
                     colorBgMenuItemSelected: 'rgba(0,0,0,0.08)'
                 },
                 pageContainer: {
                     paddingInlinePageContainerContent: 0,
                     paddingBlockPageContainerContent: 0
                 }
-            }, siderMenuType: 'sub', fixedHeader: true, appList: (props.apps?.length || 0) > 1 || collapsed ? props.apps?.map(it => {
+            }, siderMenuType: 'sub', fixedHeader: true, collapsedButtonRender: (collapsed, reactNode) => {
+                return isMobile ? undefined : reactNode;
+            }, appList: (props.apps?.length || 0) > 1 || collapsed ? props.apps?.map(it => {
                 return {
                     ...it,
                     icon: React.createElement("img", { src: it.icon, alt: "" }),
@@ -195,13 +201,16 @@ const Component = (props) => {
                     url: it.defaultPath || it.path
                 };
             }) : [], menuHeaderRender: (_logo, _title, props) => {
-                setTimeout(() => {
-                    setCollapsed(props?.collapsed === true);
-                });
+                if (props !== undefined) {
+                    setTimeout(() => {
+                        setCollapsed(props?.collapsed === true);
+                        setIsMobile(props?.isMobile === true);
+                    });
+                }
                 return React.createElement(React.Fragment, null, props?.collapsed ? undefined : React.createElement("div", { style: {
                         padding: '2px 0',
                         textIndent: 10,
-                        fontSize: 15,
+                        fontSize: token.fontSize + 2,
                         color: '#333',
                         fontWeight: 500
                     } }, app?.name));
@@ -214,8 +223,8 @@ const Component = (props) => {
                 }
             }, subMenuItemRender: (props, _defaultDom, menuProps) => {
                 return React.createElement("div", { style: {
-                        height: 32,
-                        fontSize: 13,
+                        height: token.controlHeight + 2,
+                        fontSize: token.fontSize,
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: menuProps.collapsed ? 'center' : undefined,
@@ -233,9 +242,9 @@ const Component = (props) => {
                 const isSub = (props.locale?.toString()
                     ?.split('.') || []).length > 2;
                 return React.createElement("a", { style: {
-                        fontSize: 13,
+                        fontSize: token.fontSize,
                         userSelect: 'none',
-                        height: 32,
+                        height: token.controlHeight + 2,
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: menuProps.collapsed && !isSub ? 'center' : undefined,
@@ -263,13 +272,19 @@ const Component = (props) => {
               display: block;
               margin: 0 6px;
           }
-      ` },
+      `, onClick: () => {
+                    const link = props?.logo?.link || '';
+                    if (link === '') {
+                        return;
+                    }
+                    window.location.href = link;
+                } },
                 React.createElement("img", { src: props?.logo?.path, alt: "" })), title: false, avatarProps: {
                 src: (userInfo?.avatar || '') === '' ? '/avatar.png' : userInfo?.avatar,
                 size: 'small',
                 title: React.createElement("span", { style: {
                         color: '#333',
-                        fontSize: 14
+                        fontSize: token.fontSize + 1
                     } }, userInfo?.nickName || '系统用户'),
                 render: (_props, dom) => {
                     return (React.createElement(Dropdown, { menu: {
@@ -289,7 +304,7 @@ const Component = (props) => {
                                             React.createElement(Typography.Text, { ellipsis: true, style: {
                                                     width: 200,
                                                     fontWeight: 500,
-                                                    fontSize: 14
+                                                    fontSize: token.fontSize + 1
                                                 } }, userInfo?.companyName || userInfo?.nickName)),
                                         React.createElement("p", null,
                                             React.createElement(Typography.Text, { ellipsis: true, style: { width: 200 } },

package/BackPageContainer.d.ts

@@ -0,0 +1,7 @@
+import React, { FC } from 'react';
+export declare type BackPageContainerProps = {
+    title?: string | undefined;
+    children?: React.ReactNode | undefined;
+};
+export declare const Component: FC<BackPageContainerProps>;
+export default Component;

package/BackPageContainer.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { css } from '@emotion/css';
+import { PageContainer } from '@ant-design/pro-components';
+import { useNavigate } from 'react-router-dom';
+import { theme } from 'antd';
+export const Component = (props) => {
+    const { token } = theme.useToken();
+    const navigate = useNavigate();
+    return React.createElement(React.Fragment, null,
+        React.createElement(PageContainer, { onBack: () => {
+                navigate(-1);
+            }, className: css `
+          .ant-page-header-heading {
+              padding-block-start: 0 !important;
+          }
+
+          .ant-page-header-heading-title {
+              font-size: ${token.fontSize + 2}px;
+              line-height: 1.5;
+              color: #333;
+          }
+      `, header: {
+                style: {
+                    background: '#fff',
+                    padding: '10px 24px',
+                    borderBottom: '1px solid rgba(0, 0, 0, 0.06)'
+                }
+            }, title: props.title, ghost: true, childrenContentStyle: {
+                padding: '0'
+            } },
+            React.createElement("div", { className: css `
+          padding: 12px 16px;
+      ` }, props.children)));
+};
+export default Component;

package/InlineContainer.d.ts

@@ -0,0 +1,6 @@
+import React, { FC } from 'react';
+export declare type InlineContainer = {
+    children?: React.ReactNode;
+};
+export declare const Component: FC<InlineContainer>;
+export default Component;

package/InlineContainer.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { App, ConfigProvider } from 'antd';
+export const Component = (props) => {
+    return React.createElement(App, null,
+        React.createElement(ConfigProvider, { theme: {
+                token: {
+                    fontSize: 12,
+                    controlHeight: 26,
+                    fontWeightStrong: 500
+                },
+                components: {
+                    Table: {
+                        motion: false,
+                        headerColor: '#333',
+                        rowHoverBg: '#f5f6f7',
+                        rowSelectedBg: '#f4f5f6',
+                        rowSelectedHoverBg: '#e6e7e8',
+                        headerBg: '#fafafa',
+                        cellPaddingInlineSM: 6,
+                        cellPaddingBlockSM: 7
+                    },
+                    Switch: {
+                        fontSize: 10
+                    }
+                }
+            } }, props?.children));
+};
+export default Component;

package/MediaModals.d.ts

@@ -0,0 +1,32 @@
+import { ReactNode } from 'react';
+import { DirectorySelectProps } from 'beer-assembly/DirectorySelect';
+export type Handler<T> = {
+    ok: (callback?: (params: T) => void) => void;
+};
+type DirectoryRequest = NonNullable<DirectorySelectProps['request']>;
+export declare type MediaItem = {
+    id: string;
+    name: string;
+    type: 'DIRECTORY' | 'FILE';
+    url: string;
+    active: boolean;
+};
+export declare type RequestParams = {
+    /**
+     * 获取列表数据.
+     * @param parentId 父类ID.
+     */
+    requestList: (parentId: string) => Promise<MediaItem[]>;
+    rename: (id: string, name: string) => Promise<Boolean>;
+    copy: (id: string) => Promise<Boolean>;
+    move: (moveId: string, targetId: string) => Promise<Boolean>;
+    remove: (id: string) => Promise<Boolean>;
+    createDirectory: (parentId: string, name: string) => Promise<Boolean>;
+    putFile: (parentId: string, files: FileList) => Promise<Boolean>;
+} & {
+    directory: DirectoryRequest;
+};
+export declare class MediaModals {
+    static useMedia(request?: RequestParams): [Handler<string[]>, ReactNode];
+}
+export {};