beer-assembly-biz 1.1.3-alpha.16 → 1.1.3-alpha.18

package/layout/AppLayout.d.ts

@@ -19,11 +19,11 @@ export declare type App = {
     /**
      * App图标
      */
-    icon: string;
+    icon?: string;
     /**
      * App描述
      */
-    description: string;
+    description?: string;
     /**
      * 路径
      */
@@ -32,6 +32,10 @@ export declare type App = {
      * App 默认路径
      */
     defaultPath: string;
+    /**
+     * 配置.
+     */
+    config?: {};
 };
 /**
  * 用户信息实体.
@@ -66,6 +70,18 @@ export declare type LayoutProps = {
      * App列表 (切换应用)
      */
     apps: App[];
+    /**
+     * 菜单宽度.
+     */
+    siderWidth?: number;
+    /**
+     * 菜单选项高度.
+     */
+    siderMenusItemHeight?: number;
+    /**
+     * 菜单类型.
+     */
+    siderMenuType?: 'sub' | 'group';
     /**
      * 布局内容
      */

package/layout/AppLayout.js

@@ -158,7 +158,9 @@ export const AppLayout = (props) => {
           .ant-pro-sider-collapsed-button {
               inset-block-start: 15px;
           }
-      `, selectedKeys: pathKeys, locale: "zh-CN", navTheme: "light", fixSiderbar: true, layout: "mix", contentWidth: "Fluid", splitMenus: false, bgLayoutImgList: [
+      `, style: {
+                minWidth: 1000
+            }, selectedKeys: pathKeys, locale: "zh-CN", navTheme: "light", fixSiderbar: true, layout: "mix", contentWidth: "Fluid", splitMenus: false, bgLayoutImgList: [
                 {
                     src: ImageLayout01,
                     left: 85,
@@ -177,26 +179,26 @@ export const AppLayout = (props) => {
                     left: 0,
                     width: '331px'
                 }
-            ], siderWidth: 200, token: {
-                bgLayout: '#f5f7fa',
+            ], siderWidth: props?.siderWidth ?? 190, breakpoint: props?.siderMenuType === 'group' ? 'xs' : undefined, token: {
+                bgLayout: '#F5F7FA',
                 header: {
                     heightLayoutHeader: 48
                 },
                 sider: {
-                    menuHeight: token.controlHeight + 2,
+                    menuHeight: props?.siderMenusItemHeight ?? token.controlHeight,
                     paddingBlockLayoutMenu: 4,
                     paddingInlineLayoutMenu: 4,
                     colorMenuBackground: '#fff',
-                    colorTextMenu: 'rgb(87, 89, 102)',
-                    colorTextMenuSelected: 'rgba(0,0,0,0.8)',
+                    colorTextMenu: 'rgba(0,0,0,0.75)',
+                    colorTextMenuSelected: 'rgba(0,0,0,0.85)',
                     colorBgMenuItemSelected: 'rgba(0,0,0,0.08)'
                 },
                 pageContainer: {
                     paddingInlinePageContainerContent: 0,
                     paddingBlockPageContainerContent: 0
                 }
-            }, siderMenuType: 'sub', fixedHeader: true, collapsedButtonRender: (collapsed, reactNode) => {
-                return isMobile ? undefined : reactNode;
+            }, siderMenuType: props?.siderMenuType ?? 'sub', fixedHeader: true, collapsedButtonRender: (collapsed, reactNode) => {
+                return isMobile || props?.siderMenuType === 'group' ? undefined : reactNode;
             }, appList: (props.apps?.length || 0) > 1 || collapsed ? props.apps?.map(it => {
                 return {
                     ...it,
@@ -217,7 +219,8 @@ export const AppLayout = (props) => {
                         textIndent: 10,
                         fontSize: token.fontSize + 2,
                         color: '#333',
-                        fontWeight: 600
+                        fontWeight: 600,
+                        minWidth: ((props?.siderWidth ?? 190) - 30)
                     } }, app?.name));
             }, menu: {
                 collapsedShowTitle: false,
@@ -226,35 +229,40 @@ export const AppLayout = (props) => {
                 request: async () => {
                     return requestMenuItems();
                 }
-            }, subMenuItemRender: (props, _defaultDom, menuProps) => {
+            }, subMenuItemRender: (menuDataItemProps, _defaultDom, menuProps) => {
+                if (props?.siderMenuType === 'group') {
+                    return React.createElement("span", { style: {
+                            marginLeft: 4,
+                            color: 'rgba(0,0,0,0.55)',
+                            fontSize: token.fontSize - 2
+                        } }, menuDataItemProps.name);
+                }
                 return React.createElement("div", { style: {
-                        height: token.controlHeight + 2,
+                        height: props?.siderMenusItemHeight ?? token.controlHeight,
                         fontSize: token.fontSize,
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: menuProps.collapsed ? 'center' : undefined,
                         cursor: 'pointer',
-                        width: '100%',
-                        color: '#0c0d0e'
+                        width: '100%'
                     } },
-                    React.createElement("img", { src: (props.icon || '') === '' ? undefined : props.icon?.toString(), style: {
+                    React.createElement("img", { src: (menuDataItemProps.icon || '') === '' ? undefined : menuDataItemProps.icon?.toString(), style: {
                             width: 20,
                             display: 'block',
-                            marginInlineEnd: menuProps.collapsed ? 0 : 4
+                            marginInlineEnd: menuDataItemProps.collapsed ? 0 : 4
                         }, alt: "" }),
-                    menuProps.collapsed ? undefined : props.name);
+                    menuProps.collapsed ? undefined : menuDataItemProps.name);
             }, menuItemRender: (props, defaultDom, menuProps) => {
                 const isSub = (props.locale?.toString()
                     ?.split('.') || []).length > 2;
                 return React.createElement("a", { style: {
                         fontSize: token.fontSize,
                         userSelect: 'none',
-                        height: token.controlHeight + 2,
+                        height: props?.siderMenusItemHeight ?? token.controlHeight,
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: menuProps.collapsed && !isSub ? 'center' : undefined,
-                        cursor: 'pointer',
-                        color: '#0c0d0e'
+                        cursor: 'pointer'
                     }, onClick: (e) => {
                         e.preventDefault();
                         if (props.isUrl || !props.path) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "beer-assembly-biz",
   "private": false,
-  "version": "1.1.3-alpha.16",
+  "version": "1.1.3-alpha.18",
   "scripts": {
     "pub-w": "tsc && copy package.json .\\dist\\package.json && npm publish ./dist",
     "copy": "cp -a src/rich/AIEditor.css dist/rich/AIEditor.css && cp -a src/icon dist/icon && cp -a src/images dist/images",