@tsingroc/tsingroc-components 2.0.1 → 2.1.0

package/dist/components/TmsSidebar.d.ts

@@ -0,0 +1,46 @@
+import type { MenuProps } from "antd";
+export type MenuItem = Required<MenuProps>["items"][number];
+/**
+ * TmsSidebar组件的属性接口
+ */
+export interface TmsSidebarProps extends MenuProps {
+    /**
+     * 侧边栏宽度。
+     * @default 260
+     */
+    width?: number | string;
+    /**
+     * 网站 Logo 的 URL。
+     *
+     * 建议导入图片，然后将导入得到的地址填入 `logo`，而不要硬编码地址。
+     */
+    logo?: string;
+    /**
+     * 菜单项配置，默认与 TMS 系统的菜单相同。
+     *
+     * 该属性以及其余属性的用法可参考 [`Menu` 组件的文档][1]。
+     *
+     * [1]: https://ant-design.antgroup.com/components/menu-cn
+     */
+    items?: MenuItem[];
+    /** 当前选中的菜单项 key 数组。 */
+    selectedKeys?: string[];
+    /** 当前展开的子菜单 key 数组。 */
+    openKeys?: string[];
+    /** 菜单项被选中时的回调函数。 */
+    onSelect?: MenuProps["onSelect"];
+    /** 子菜单展开/收起时的回调函数。 */
+    onOpenChange?: MenuProps["onOpenChange"];
+}
+/**
+ * TMS 系统的侧边栏组件。该组件需要放置在 [Ant Design 的 `Layout` 组件][1]内部才能正常工作。
+ *
+ * 除了文档中列出的属性之外，该组件会把额外的属性全部传递给内部的菜单 [`Menu` 组件][2]。
+ *
+ * 该组件不支持暗色模式。
+ *
+ * [1]: https://ant-design.antgroup.com/components/layout-cn
+ * [2]: https://ant-design.antgroup.com/components/menu-cn
+ */
+declare function TmsSidebar(props: TmsSidebarProps): import("react/jsx-runtime").JSX.Element;
+export default TmsSidebar;

package/dist/components/TmsSidebar.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { BarChartOutlined, SwapOutlined, TeamOutlined, } from "@ant-design/icons";
+import { ConfigProvider, Layout, Menu } from "antd";
+const { Sider } = Layout;
+const menuItem = (label, key, icon, children) => ({ key, icon, children, label });
+/** 默认菜单项配置，可以作为参考或默认值 */
+const DEFAULT_MENU_ITEMS = [
+    menuItem("数据看板", "data-board", _jsx(BarChartOutlined, {}), [
+        menuItem("宏观数据", "macro-data"),
+        menuItem("合约看板", "contract-overview"),
+        menuItem("数据复盘", "data-review"),
+    ]),
+    menuItem("交易管理", "trade-management", _jsx(SwapOutlined, {}), [
+        menuItem("日前交易", "day-ahead-trade"),
+        menuItem("现货交易", "spot-trade"),
+        menuItem("中长期交易", "long-term-trade"),
+    ]),
+    menuItem("合约管理", "customer-management", _jsx(TeamOutlined, {}), [
+        menuItem("客户总览", "customer-overview"),
+        menuItem("售电合约管理", "sales-contract"),
+        menuItem("供应商管理", "supplier-management"),
+        menuItem("购电合约管理", "purchase-contract"),
+    ]),
+];
+/**
+ * TMS 系统的侧边栏组件。该组件需要放置在 [Ant Design 的 `Layout` 组件][1]内部才能正常工作。
+ *
+ * 除了文档中列出的属性之外，该组件会把额外的属性全部传递给内部的菜单 [`Menu` 组件][2]。
+ *
+ * 该组件不支持暗色模式。
+ *
+ * [1]: https://ant-design.antgroup.com/components/layout-cn
+ * [2]: https://ant-design.antgroup.com/components/menu-cn
+ */
+function TmsSidebar(props) {
+    const { width = 260, logo, items = DEFAULT_MENU_ITEMS, selectedKeys, openKeys, onSelect, onOpenChange, ...rest } = props;
+    return (_jsxs(Sider, { theme: "light", width: width, style: {
+            boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
+            overflowY: "auto",
+        }, children: [_jsx("div", { style: {
+                    height: "98px",
+                    padding: "28px 78px",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    transition: "all 0.3s",
+                }, children: _jsx("img", { alt: "logo", src: logo, style: {
+                        width: "100%",
+                        height: "100%",
+                        objectFit: "contain",
+                    } }) }), _jsx(ConfigProvider, { theme: {
+                    components: {
+                        Menu: {
+                            itemMarginBlock: 0,
+                            itemMarginInline: 0,
+                            itemSelectedColor: "#1890FF",
+                            itemSelectedBg: "#F0F7FF",
+                        },
+                    },
+                }, children: _jsx(Menu, { mode: "inline", style: { borderRight: 0 }, selectedKeys: selectedKeys, openKeys: openKeys, onSelect: onSelect, onOpenChange: onOpenChange, items: items, ...rest }) })] }));
+}
+export default TmsSidebar;
+//# sourceMappingURL=TmsSidebar.js.map

package/dist/components/TmsSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TmsSidebar.js","sourceRoot":"","sources":["../../src/components/TmsSidebar.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,gBAAgB,EAChB,YAAY,EACZ,YAAY,GACb,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAIpD,MAAM,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC;AAIzB,MAAM,QAAQ,GAAG,CACf,KAAsB,EACtB,GAAc,EACd,IAAsB,EACtB,QAAqB,EACX,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;AAEhD,yBAAyB;AACzB,MAAM,kBAAkB,GAAe;IACrC,QAAQ,CAAC,MAAM,EAAE,YAAY,EAAE,KAAC,gBAAgB,KAAG,EAAE;QACnD,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;QAC9B,QAAQ,CAAC,MAAM,EAAE,mBAAmB,CAAC;QACrC,QAAQ,CAAC,MAAM,EAAE,aAAa,CAAC;KAChC,CAAC;IACF,QAAQ,CAAC,MAAM,EAAE,kBAAkB,EAAE,KAAC,YAAY,KAAG,EAAE;QACrD,QAAQ,CAAC,MAAM,EAAE,iBAAiB,CAAC;QACnC,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;QAC9B,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC;KACrC,CAAC;IACF,QAAQ,CAAC,MAAM,EAAE,qBAAqB,EAAE,KAAC,YAAY,KAAG,EAAE;QACxD,QAAQ,CAAC,MAAM,EAAE,mBAAmB,CAAC;QACrC,QAAQ,CAAC,QAAQ,EAAE,gBAAgB,CAAC;QACpC,QAAQ,CAAC,OAAO,EAAE,qBAAqB,CAAC;QACxC,QAAQ,CAAC,QAAQ,EAAE,mBAAmB,CAAC;KACxC,CAAC;CACH,CAAC;AAmCF;;;;;;;;;GASG;AACH,SAAS,UAAU,CAAC,KAAsB;IACxC,MAAM,EACJ,KAAK,GAAG,GAAG,EACX,IAAI,EACJ,KAAK,GAAG,kBAAkB,EAC1B,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IACV,OAAO,CACL,MAAC,KAAK,IACJ,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;YACL,SAAS,EAAE,+BAA+B;YAC1C,SAAS,EAAE,MAAM;SAClB,aAED,cACE,KAAK,EAAE;oBACL,MAAM,EAAE,MAAM;oBACd,OAAO,EAAE,WAAW;oBACpB,OAAO,EAAE,MAAM;oBACf,UAAU,EAAE,QAAQ;oBACpB,cAAc,EAAE,QAAQ;oBACxB,UAAU,EAAE,UAAU;iBACvB,YAED,cACE,GAAG,EAAC,MAAM,EACV,GAAG,EAAE,IAAI,EACT,KAAK,EAAE;wBACL,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,SAAS,EAAE,SAAS;qBACrB,GACD,GACE,EACN,KAAC,cAAc,IACb,KAAK,EAAE;oBACL,UAAU,EAAE;wBACV,IAAI,EAAE;4BACJ,eAAe,EAAE,CAAC;4BAClB,gBAAgB,EAAE,CAAC;4BACnB,iBAAiB,EAAE,SAAS;4BAC5B,cAAc,EAAE,SAAS;yBAC1B;qBACF;iBACF,YAED,KAAC,IAAI,IACH,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,EACzB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,KACR,IAAI,GACR,GACa,IACX,CACT,CAAC;AACJ,CAAC;AAED,eAAe,UAAU,CAAC"}

package/dist/index.d.ts

@@ -4,5 +4,6 @@ import ImageBackground, { type ImageBackgroundProps } from "./components/ImageBa
 export { ImageBackground, type ImageBackgroundProps };
 export { default as QuickDateRangePicker, type QuickDateRangePickerProps, } from "./components/QuickDateRangePicker";
 export { default as SegmentedButtons, TimeUnitSwitcher, type TimeUnitSwitcherProps, } from "./components/SegmentedButtons";
+export { default as TmsSidebar, type TmsSidebarProps, } from "./components/TmsSidebar";
 import TsingrocDatePicker, { type DatePickerProps } from "./components/TsingrocDatePicker";
 export { TsingrocDatePicker, type DatePickerProps };

package/dist/index.js

@@ -4,6 +4,7 @@ import ImageBackground, {} from "./components/ImageBackground";
 export { ImageBackground };
 export { default as QuickDateRangePicker, } from "./components/QuickDateRangePicker";
 export { default as SegmentedButtons, TimeUnitSwitcher, } from "./components/SegmentedButtons";
+export { default as TmsSidebar, } from "./components/TmsSidebar";
 import TsingrocDatePicker, {} from "./components/TsingrocDatePicker";
 export { TsingrocDatePicker };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAsB,MAAM,uBAAuB,CAAC;AAEhF,OAAO,EACL,OAAO,IAAI,gBAAgB,GAE5B,MAAM,+BAA+B,CAAC;AAEvC,OAAO,eAAe,EAAE,EAEvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,eAAe,EAA6B,CAAC;AAEtD,OAAO,EACL,OAAO,IAAI,oBAAoB,GAEhC,MAAM,mCAAmC,CAAC;AAE3C,OAAO,EACL,OAAO,IAAI,gBAAgB,EAC3B,gBAAgB,GAEjB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,kBAAkB,EAAE,EAE1B,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAwB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAsB,MAAM,uBAAuB,CAAC;AAEhF,OAAO,EACL,OAAO,IAAI,gBAAgB,GAE5B,MAAM,+BAA+B,CAAC;AAEvC,OAAO,eAAe,EAAE,EAEvB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,eAAe,EAA6B,CAAC;AAEtD,OAAO,EACL,OAAO,IAAI,oBAAoB,GAEhC,MAAM,mCAAmC,CAAC;AAE3C,OAAO,EACL,OAAO,IAAI,gBAAgB,EAC3B,gBAAgB,GAEjB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EACL,OAAO,IAAI,UAAU,GAEtB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,kBAAkB,EAAE,EAE1B,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAwB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsingroc/tsingroc-components",
-  "version": "2.0.1",
+  "version": "2.1.0",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",