aldehyde 0.2.461 → 0.2.463

package/src/aldehyde/layout/menu/l2menu-quick-bar.tsx

@@ -1,7 +1,6 @@
 import React, { CSSProperties } from "react";
-import { Dropdown, Menu, Drawer, Space, Button } from "antd";
+import { Dropdown, Drawer, Space, Button } from "antd";
 import { AppstoreOutlined } from "@ant-design/icons";
-import "antd/dist/reset.css";
 import { Level2Menu } from "../../tmpl/interface";
 import HCDataSource from "../../tmpl/hc-data-source";
 import LtmplTable from "../../module/ltmpl-table";
@@ -23,6 +22,7 @@ interface L2MenuQuickBarState {
   anyState?: boolean;
   currentId?: string;
   showDraw?: boolean;
+  drawerSize?: number | string; // 抽屉组件尺寸
 }
 
 class L2MenuQuickBar extends React.PureComponent<
@@ -34,6 +34,7 @@ class L2MenuQuickBar extends React.PureComponent<
     anyState: false,
     currentId: undefined,
     showDraw: false,
+    drawerSize: "92vw",
   };
   static defaultProps = {
     backgroudColor: "#4a5f74",
@@ -80,29 +81,22 @@ class L2MenuQuickBar extends React.PureComponent<
     const { backgroudColor, style = {} } = this.props;
     const { translate } = this.context;
     let total: number = 0;
-    const syyy: CSSProperties = {
-      "--message-bar-backgroupd": backgroudColor,
-    } as CSSProperties;
-    const menu = (
-      <Menu key={1}>
-        {quickBars.map((quickBar, index) => {
-          if (quickBar.count) {
-            total = total + quickBar.count;
-          }
-          const renderIcon = quickBar.l2Menu.icon ? <IconFont type={quickBar.l2Menu.icon} /> : "";
-          return (
-            <Menu.Item key={index} style={{ textAlign: "left" }}>
-              <span onClick={() => this.showDraw(quickBar.l2Menu.id)}>
-                <Space>
-                  {renderIcon}
-                  {translate("${" + quickBar.l2Menu.title + "}")}
-                </Space>
-              </span>
-            </Menu.Item>
-          );
-        })}
-      </Menu>
-    );
+    const syyy: CSSProperties = { "--message-bar-backgroupd": backgroudColor } as CSSProperties;
+    const menu = quickBars.map((quickBar, index) => {
+      if (quickBar.count) {
+        total = total + quickBar.count;
+      }
+      const renderIcon = quickBar.l2Menu.icon ? <IconFont type={quickBar.l2Menu.icon} /> : "";
+      return {
+        key: index,
+        label: <span onClick={() => this.showDraw(quickBar.l2Menu.id)}>
+          <Space>
+            {renderIcon}
+            {translate("${" + quickBar.l2Menu.title + "}")}
+          </Space>
+        </span>
+      };
+    });
 
     if (!quickBars || quickBars.length == 0) {
       return;
@@ -128,7 +122,7 @@ class L2MenuQuickBar extends React.PureComponent<
       );
     } else {
       return (
-        <Dropdown overlay={menu} placement="bottomCenter">
+        <Dropdown menu={{ items: menu }} placement="bottomCenter">
           <Button
             icon={<AppstoreOutlined />}
             shape="default"
@@ -150,7 +144,7 @@ class L2MenuQuickBar extends React.PureComponent<
   };
 
   render() {
-    const { quickBars, showDraw, currentId } = this.state;
+    const { quickBars, showDraw, currentId, drawerSize } = this.state;
     const { translate } = this.context;
     return (
       <>
@@ -158,22 +152,20 @@ class L2MenuQuickBar extends React.PureComponent<
         <Drawer
           placement={"left"}
           title={translate("${快捷查询}")}
+          size={drawerSize}
+          resizable={{ onResize: (newSize => this.setState({ drawerSize: newSize })) }}
           closable={true}
           mask={false}
           onClose={this.closeDrawer}
           open={showDraw}
-          width="100%"
-          rootStyle={{
-            width: "calc(100% - 280px)",
-            maxWidth: 1960,
-          }}
           extra={
             <Space>
               <Button onClick={this.closeDrawer}>关闭</Button>
             </Space>
           }
+          styles={{ body: { minWidth: "720px" } }}
         >
-          <LtmplTable serverKey={null} sourceId={currentId}></LtmplTable>
+          <LtmplTable serverKey={null} sourceId={currentId} />
         </Drawer>
       </>
     );

package/src/aldehyde/layout2/components/search-menu.tsx

@@ -25,7 +25,7 @@ interface Props extends ButtonProps {
 }
 
 const Index = (props: Props) => {
-    const { menuList } = props;
+    const { menuList, ...otherProps } = props;
     const { translate, getLocale } = useLocale();
     const [menu, setMenu] = useState<MenuType[]>([]);
     const [searchValue, setSearchValue] = useState<string>();
@@ -67,7 +67,7 @@ const Index = (props: Props) => {
     />;
 
     return (
-        <Popover placement="bottom" trigger="click" content={renderMenu} styles={{ body: { padding: 2 } }} destroyOnHidden onOpenChange={(val) => val && setSelectInit(true)}>
+        <Popover placement="bottom" trigger="click" content={renderMenu} styles={{ container: { padding: 2 } }} destroyOnHidden onOpenChange={(val) => val && setSelectInit(true)}>
             <Button type="link" icon={<SearchOutlined />} shape="default" size="large"
                 style={{
                     width: "100%",
@@ -76,7 +76,7 @@ const Index = (props: Props) => {
                     padding: 0,
                     borderRadius: 0,
                     color: "#fff",
-                }} {...props}
+                }} {...otherProps}
             />
         </Popover>
     );

package/src/aldehyde/layout2/components/user-button.tsx

@@ -39,7 +39,7 @@ interface Props extends ButtonProps {
 }
 
 const UserButton: React.FC<Props> = (props) => {
-  const { logoutUrl = "/login2", customRender, layoutRootPath = "v2", themeConfig } = props;
+  const { logoutUrl = "/login2", customRender, layoutRootPath = "v2", themeConfig, ...otherProps } = props;
   // translate
   const { translate, changeSiderCollapsed, getSiderCollapsed, compactTheme, changeCompactTheme } = useLocale();
   const [keepAliveTabs, setKeepAliveTabs] = useSessionStorageState<KeepAliveTab[]>('keepAliveTabs', {
@@ -246,7 +246,7 @@ const UserButton: React.FC<Props> = (props) => {
             borderRadius: 0,
             color: "#fff",
           }}
-          {...props}
+          {...otherProps}
         >
           {isLogin ? userConfig?.name : translate("${请登录}")}
         </Button>

package/src/aldehyde/layout2/page.tsx

@@ -263,7 +263,7 @@ const Page: React.FC<PagePropsType> = (props: PagePropsType) => {
   );
 
   return (
-    <DocumentTitle title={documentTitle}>
+    <DocumentTitle title={documentTitle || ""}>
       <div
         ref={pageRef}
         style={{

package/src/aldehyde/layout2/sider.tsx

@@ -87,9 +87,9 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, themeConfig }) =
 
   // menu
   const [menu, setMenu] = useState<MenuItem[]>([]);
-  const getMenuWithSecoundFloor = (
-    secoundFloorMenu: SecoundFloorMenuList[number]
-  ) => {
+
+  const getMenuWithSecoundFloor = (secoundFloorMenu: SecoundFloorMenuList[number]) => {
+    const locale = getLocale();
     return handlePropsMenuToAntdMenu(secoundFloorMenu, (menuItem, floor) => {
       const { disabled, label, children, icon } = menuItem;
       const renderIcon = (themeConfig?.showLeftMenuIcon && icon) ? <IconFont type={icon} /> : "";
@@ -110,26 +110,27 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, themeConfig }) =
 
       const { path, target } = getLeftMostRouteInfo(menuItem);
 
-      if (Array.isArray(children) && !children.length)
-        return (
+      if (Array.isArray(children) && !children.length) {
+        const navLink = <NavLink
+          to={`/${path}`}
+          target={target}
+          style={{
+            color: "inherit",
+            width: "100%",
+            height: "100%",
+            display: "block",
+            textOverflow: "ellipsis",
+            overflow: "hidden",
+          }}
+        >
+          <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
+        </NavLink>;
+        return (locale === "zh" ? navLink :
           <Tooltip title={translate("${" + label + "}")}>
-            <NavLink
-              to={`/${path}`}
-              target={target}
-              style={{
-                color: "inherit",
-                width: "100%",
-                height: "100%",
-                display: "block",
-                textOverflow: "ellipsis",
-                overflow: "hidden",
-              }}
-            >
-              <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
-            </NavLink>
+            {navLink}
           </Tooltip>
         );
-
+      }
       return <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>;
     });
   };

package/src/aldehyde/layout3/css/main.less

@@ -19,7 +19,8 @@
   }
 
   .ant-drawer,
-  .ant-modal-content {
+  .ant-modal-content,
+  .ant-modal-container {
 
     .ant-card-head {
       background: transparent !important;
@@ -95,7 +96,8 @@
   }
 
   /* selectTable 弹窗样式 */
-  .ant-popover-inner-content {
+  .ant-popover-inner-content,
+  .ant-popover-content {
     .select-table-popover {
       background-color: #041B3B !important;
       border-color: #15325b !important;
@@ -126,7 +128,9 @@
 }
 
 .v3-antd-modal {
-  .ant-modal-content {
+
+  .ant-modal-content,
+  .ant-modal-container {
     background: var(--ant-color-bg-base) !important;
     border: 1px solid var(--ant-color-border-secondary) !important;
   }

package/src/aldehyde/layout3/page.tsx

@@ -63,7 +63,7 @@ const Page: React.FC<PagePropsType> = (props: PagePropsType) => {
   );
 
   return (
-    <DocumentTitle title={documentTitle}>
+    <DocumentTitle title={documentTitle || ""}>
       <div
         ref={pageRef}
         className="v3-main"

package/src/aldehyde/layout3/sider.tsx

@@ -74,6 +74,7 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, themeConfig }) =
 
   // menu
   const getMenuWithSecoundFloor = (secoundFloorMenu: SecoundFloorMenuList[number]) => {
+    const locale = getLocale();
     return handlePropsMenuToAntdMenu(secoundFloorMenu, (menuItem) => {
       const { disabled, label, children, icon } = menuItem;
       const renderIcon = (themeConfig?.showLeftMenuIcon && icon) ? <IconFont type={icon} /> : "";
@@ -91,25 +92,27 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, themeConfig }) =
           </div>
         );
       const { path, target } = getLeftMostRouteInfo(menuItem);
-      if (Array.isArray(children) && !children.length)
-        return (
+      if (Array.isArray(children) && !children.length) {
+        const navLink = <NavLink
+          to={`/${path}`}
+          target={target}
+          style={{
+            color: "inherit",
+            width: "100%",
+            height: "100%",
+            display: "block",
+            textOverflow: "ellipsis",
+            overflow: "hidden",
+          }}
+        >
+          <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
+        </NavLink>;
+        return (locale === "zh" ? navLink :
           <Tooltip title={translate("${" + label + "}")}>
-            <NavLink
-              to={`/${path}`}
-              target={target}
-              style={{
-                color: "inherit",
-                width: "100%",
-                height: "100%",
-                display: "block",
-                textOverflow: "ellipsis",
-                overflow: "hidden",
-              }}
-            >
-              <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
-            </NavLink>
+            {navLink}
           </Tooltip>
         );
+      }
       return <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>;
     });
   };

package/src/aldehyde/layout4/css/main.less

@@ -19,7 +19,8 @@
   }
 
   .ant-drawer,
-  .ant-modal-content {
+  .ant-modal-content,
+  .ant-modal-container {
 
     .ant-card-head {
       background: transparent !important;
@@ -88,7 +89,8 @@
   }
 
   /* selectTable 弹窗样式 */
-  .ant-popover-inner-content {
+  .ant-popover-inner-content,
+  .ant-popover-content {
     .select-table-popover {
       background-color: #001325 !important;
       border-color: #15325b !important;
@@ -119,7 +121,9 @@
 }
 
 .v4-antd-modal {
-  .ant-modal-content {
+
+  .ant-modal-content,
+  .ant-modal-container {
     background: var(--ant-color-bg-base) !important;
     border: 1px solid var(--ant-color-border-secondary) !important;
   }

package/src/aldehyde/layout4/page.tsx

@@ -68,7 +68,7 @@ const Page: React.FC<PagePropsType> = (props: PagePropsType) => {
   );
 
   return (
-    <DocumentTitle title={documentTitle}>
+    <DocumentTitle title={documentTitle || ""}>
       <div
         ref={pageRef}
         className="v4-main"

package/src/aldehyde/layout4/sider.tsx

@@ -77,6 +77,7 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, themeConfig }) =
 
   // menu
   const getMenuWithSecoundFloor = (secoundFloorMenu: SecoundFloorMenuList[number]) => {
+    const locale = getLocale();
     return handlePropsMenuToAntdMenu(secoundFloorMenu, (menuItem) => {
       const { disabled, label, children, icon } = menuItem;
       const renderIcon = (themeConfig?.showLeftMenuIcon && icon) ? <IconFont type={icon} /> : "";
@@ -94,25 +95,27 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, themeConfig }) =
           </div>
         );
       const { path, target } = getLeftMostRouteInfo(menuItem);
-      if (Array.isArray(children) && !children.length)
-        return (
+      if (Array.isArray(children) && !children.length) {
+        const navLink = <NavLink
+          to={`/${path}`}
+          target={target}
+          style={{
+            color: "inherit",
+            width: "100%",
+            height: "100%",
+            display: "block",
+            textOverflow: "ellipsis",
+            overflow: "hidden",
+          }}
+        >
+          <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
+        </NavLink>;
+        return (locale === "zh" ? navLink :
           <Tooltip title={translate("${" + label + "}")}>
-            <NavLink
-              to={`/${path}`}
-              target={target}
-              style={{
-                color: "inherit",
-                width: "100%",
-                height: "100%",
-                display: "block",
-                textOverflow: "ellipsis",
-                overflow: "hidden",
-              }}
-            >
-              <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
-            </NavLink>
+            {navLink}
           </Tooltip>
         );
+      }
       return <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>;
     });
   };

package/src/aldehyde/layout5/page.tsx

@@ -67,7 +67,7 @@ const Page: React.FC<PagePropsType> = (props: PagePropsType) => {
   );
 
   return (
-    <DocumentTitle title={documentTitle}>
+    <DocumentTitle title={documentTitle || ""}>
       <div
         ref={pageRef}
         style={{

package/src/aldehyde/layout5/sider.tsx

@@ -82,6 +82,7 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, systemName, logo
 
   // menu
   const getMenuWithSecoundFloor = (secoundFloorMenu: SecoundFloorMenuList[number]) => {
+    const locale = getLocale();
     return handlePropsMenuToAntdMenu(secoundFloorMenu, (menuItem) => {
       const { disabled, label, children, icon } = menuItem;
       const renderIcon = (themeConfig?.showLeftMenuIcon && icon) ? <IconFont type={icon} /> : "";
@@ -99,25 +100,27 @@ const Sider: React.FC<SiderPropsType> = ({ menuList, collapsed, systemName, logo
           </div>
         );
       const { path, target } = getLeftMostRouteInfo(menuItem);
-      if (Array.isArray(children) && !children.length)
-        return (
+      if (Array.isArray(children) && !children.length) {
+        const navLink = <NavLink
+          to={`/${path}`}
+          target={target}
+          style={{
+            color: "inherit",
+            width: "100%",
+            height: "100%",
+            display: "block",
+            textOverflow: "ellipsis",
+            overflow: "hidden",
+          }}
+        >
+          <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
+        </NavLink>;
+        return (locale === "zh" ? navLink :
           <Tooltip title={translate("${" + label + "}")}>
-            <NavLink
-              to={`/${path}`}
-              target={target}
-              style={{
-                color: "inherit",
-                width: "100%",
-                height: "100%",
-                display: "block",
-                textOverflow: "ellipsis",
-                overflow: "hidden",
-              }}
-            >
-              <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>
-            </NavLink>
+            {navLink}
           </Tooltip>
         );
+      }
       return <Space size={"small"}>{renderIcon}{translate("${" + label + "}")}</Space>;
     });
   };

package/src/aldehyde/list/gantt/index.less

@@ -2,6 +2,7 @@
     margin-top: 6px;
 
     .ant-spin-nested-loading,
+    .ant-spin,
     .ant-spin-container {
         height: 100%;
     }

package/src/aldehyde/lowcode-components/lowcode-view/index.less

@@ -6,6 +6,7 @@
     /* Firefox */
 
     .ant-spin-nested-loading,
+    .ant-spin,
     .ant-spin-container {
         width: 100%;
         height: 100%;

package/src/aldehyde/module/block-menu-tree-drawer.tsx

@@ -16,7 +16,8 @@ interface BlockMenuTreeDrawerProps {
 interface BlockMenuTreeDrawerState {
     selectedAuths: string[],
     loading: boolean,
-    role?: object
+    role?: object,
+    drawerSize?: number | string; // 抽屉组件尺寸
 }
 
 export default class BlockMenuTreeDrawer extends React.PureComponent<BlockMenuTreeDrawerProps, BlockMenuTreeDrawerState> {
@@ -32,13 +33,16 @@ export default class BlockMenuTreeDrawer extends React.PureComponent<BlockMenuTr
     state = {
         selectedAuths: [],
         loading: true,
-        role: undefined
+        role: undefined,
+        drawerSize: undefined,
     }
 
     async componentDidMount() {
-
         await this.loadData();
+        const { width } = this.props;
+        this.setState({ drawerSize: width });
     }
+
     async componentDidUpdate(preProps) {
         const { roleCode } = this.props
         const { roleCode: preRoleCode } = preProps
@@ -80,23 +84,24 @@ export default class BlockMenuTreeDrawer extends React.PureComponent<BlockMenuTr
 
 
     render() {
-        const { width, onCancel, open } = this.props;
+        const { onCancel, open } = this.props;
         const placement = this.props.placement || 'left';
-        const { loading, role } = this.state;
+        const { loading, role, drawerSize } = this.state;
+        const maxSize = document.documentElement.clientWidth * 0.9;
+
         return (<Drawer
             loading={loading}
             title={role?.name}
             placement={placement}
+            size={drawerSize}
+            resizable={{ onResize: (newSize => this.setState({ drawerSize: newSize })) }}
+            maxSize={maxSize}
             closable={true}
             mask={false}
             onClose={onCancel}
             // onOk={()=>this.saveAuth}
             open={open}
-            width={width}
             extra={[<Button type={'primary'} onClick={this.saveAuth} >{translate("${保存}")}</Button>]}
-            style={{
-                maxWidth: '92vw',
-            }}
         // extra={
         //     <Space>{this.getFooter()}</Space>
         // }
@@ -105,7 +110,7 @@ export default class BlockMenuTreeDrawer extends React.PureComponent<BlockMenuTr
                 this.setState({
                     selectedAuths: auths
                 })
-            }}></BlockMenuTree>
+            }} />
         </Drawer>
         )