npm - @ditari/bsui - Versions diffs - 5.1.3 → 5.1.5 - Mend

@ditari/bsui 5.1.3 → 5.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (43) hide show

package/dist/esm/components/layout/Show.mjs CHANGED Viewed

@@ -1,12 +1,13 @@
 import { defineComponent, inject, computed, createVNode, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
-import { theme, Watermark, Flex, PageHeader } from 'ant-design-vue';
+import { theme, Watermark, Flex, PageHeader, Spin } from 'ant-design-vue';
 import { storeToRefs } from 'pinia';
 import { useWindowScroll } from '@vueuse/core';
 import { AppContextKey } from './AppContext.mjs';
 import { LeftOutlined } from '@ant-design/icons-vue';
 import { useAppStore, useNavTabStore } from '@ditari/store';
-import { css } from '@emotion/css';
+import { css, cx } from '@emotion/css';
+import { useDesign } from '../../hooks/useDesign.mjs';
 "use strict";
 const getProps = () => {
@@ -18,6 +19,10 @@ const getProps = () => {
     loading: {
       type: Boolean,
       default: false
+    },
+    loadingText: {
+      type: String,
+      default: "\u6B63\u5728\u8BF7\u6C42..."
     }
   };
 };
@@ -32,6 +37,10 @@ const show = /* @__PURE__ */ defineComponent({
       useToken
     } = theme;
     const appContext = inject(AppContextKey, null);
+    const {
+      getPrefixCls
+    } = useDesign("show-layout");
+    const rootCls = getPrefixCls();
     const watermarkContent = computed(() => {
       var _a;
       return (_a = appContext == null ? void 0 : appContext.watermarkContent) == null ? void 0 : _a.value.content;
@@ -40,6 +49,7 @@ const show = /* @__PURE__ */ defineComponent({
       token
     } = useToken();
     const loading = computed(() => props.loading);
+    const loadingText = computed(() => props.loadingText);
     const {
       layout,
       modeConfig,
@@ -115,45 +125,74 @@ const show = /* @__PURE__ */ defineComponent({
     expose({
       close: onClosePage
     });
-    return () => createVNode(Watermark, {
-      "content": watermarkContent.value
-    }, {
-      default: () => [createVNode(Flex, {
-        "vertical": true
+    function showContent() {
+      return createVNode("div", {
+        "class": cx(rootCls),
+        "style": {
+          display: !loading.value ? "block" : "none"
+        }
+      }, [createVNode(Watermark, {
+        "content": watermarkContent.value
       }, {
-        default: () => {
-          var _a, _b;
-          return [createVNode(PageHeader, {
-            "ghost": ghost.value,
-            "class": pageHeaderStyle.value,
-            "onBack": () => onBack(),
-            "title": pageTitle()
-          }, {
-            backIcon: () => createVNode("div", null, [createVNode(LeftOutlined, {
-              "style": {
-                fontSize: "26px"
+        default: () => [createVNode(Flex, {
+          "vertical": true
+        }, {
+          default: () => {
+            var _a, _b;
+            return [createVNode(PageHeader, {
+              "ghost": ghost.value,
+              "class": pageHeaderStyle.value,
+              "onBack": () => onBack(),
+              "title": pageTitle()
+            }, {
+              backIcon: () => createVNode("div", null, [createVNode(LeftOutlined, {
+                "style": {
+                  fontSize: "26px"
+                }
+              }, null)]),
+              extra: () => {
+                var _a2;
+                return (_a2 = slots.extra) == null ? void 0 : _a2.call(slots);
+              },
+              footer: () => {
+                var _a2;
+                return (_a2 = slots.footer) == null ? void 0 : _a2.call(slots);
+              },
+              subTitle: () => {
+                var _a2;
+                return (_a2 = slots.subTitle) == null ? void 0 : _a2.call(slots);
               }
-            }, null)]),
-            extra: () => {
-              var _a2;
-              return (_a2 = slots.extra) == null ? void 0 : _a2.call(slots);
-            },
-            footer: () => {
-              var _a2;
-              return (_a2 = slots.footer) == null ? void 0 : _a2.call(slots);
-            },
-            subTitle: () => {
-              var _a2;
-              return (_a2 = slots.subTitle) == null ? void 0 : _a2.call(slots);
-            }
-          }), createVNode("div", {
-            "class": contentStyle.value
-          }, [loading.value ? createVNode("div", null, null) : (_a = slots.default) == null ? void 0 : _a.call(slots)]), slots.bottomFooter ? createVNode("div", {
-            "class": footerStyle.value
-          }, [(_b = slots.bottomFooter) == null ? void 0 : _b.call(slots)]) : null];
+            }), createVNode("div", {
+              "class": contentStyle.value
+            }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]), slots.bottomFooter ? createVNode("div", {
+              "class": footerStyle.value
+            }, [(_b = slots.bottomFooter) == null ? void 0 : _b.call(slots)]) : null];
+          }
+        })]
+      })]);
+    }
+    function loadingContent() {
+      return createVNode("div", {
+        "style": {
+          height: "100%",
+          display: loading.value ? "block" : "none"
         }
-      })]
-    });
+      }, [createVNode("div", {
+        "style": {
+          height: "100%",
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center"
+        }
+      }, [slots.loading ? slots.loading() : createVNode(Spin, {
+        "tip": loadingText.value
+      }, null)])]);
+    }
+    return () => createVNode("div", {
+      "style": {
+        height: "100%"
+      }
+    }, [showContent(), loadingContent()]);
   }
 });

package/dist/esm/components/layout/Show.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Show.mjs","sources":["../../../../src/components/layout/Show.tsx"],"sourcesContent":["import {\r\n computed,\r\n ComputedRef,\r\n defineComponent,\r\n inject,\r\n ref\r\n} from \"vue\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport {\r\n Flex,\r\n PageHeader,\r\n Spin,\r\n theme,\r\n Watermark\r\n} from \"ant-design-vue\";\r\nimport { storeToRefs } from \"pinia\";\r\nimport { useWindowScroll } from \"@vueuse/core\";\r\n\r\nimport { AppContext, AppContextKey } from \"./AppContext\";\r\nimport { LeftOutlined } from \"@ant-design/icons-vue\";\r\nimport { useAppStore, useNavTabStore } from \"@ditari/store\";\r\nimport { css } from \"@emotion/css\";\r\nimport type { GlobalToken } from \"ant-design-vue/es/theme/interface\";\r\n\r\nconst getProps = () => {\r\n return {\r\n close: {\r\n type: Boolean,\r\n default: false\r\n },\r\n loading: {\r\n type: Boolean,\r\n default: false\r\n }\r\n };\r\n};\r\nconst show = defineComponent({\r\n name: \"DShowLayout\",\r\n props: getProps(),\r\n setup(props, { slots, expose }) {\r\n const { useToken } = theme;\r\n\r\n const appContext = inject<AppContext \| null>(\r\n AppContextKey,\r\n null\r\n );\r\n\r\n const watermarkContent = computed(\r\n () => appContext?.watermarkContent?.value.content\r\n );\r\n\r\n const { token }: { token: ComputedRef<GlobalToken> } =\r\n useToken();\r\n\r\n const loading = computed(() => props.loading);\r\n\r\n const { layout, modeConfig, refresh } =\r\n storeToRefs(useAppStore());\r\n const { deleteTabs } = useNavTabStore();\r\n\r\n const route = useRoute();\r\n const router = useRouter();\r\n\r\n const { y } = useWindowScroll();\r\n\r\n const pageHeaderStyle = computed(\r\n () => css`\r\n position: sticky;\r\n top: ${layout.value.headerHeight}px;\r\n z-index: 10;\r\n padding: 0;\r\n transition: all 0.3s;\r\n background-color: ${token.value.colorBgLayout};\r\n\r\n ${y.value > 0\r\n ? \"box-shadow:0 10px 10px rgba(0, 0, 0, 0.15);\"\r\n : \"\"}\r\n .ant-page-header-back {\r\n height: 100%;\r\n margin-right: 0;\r\n\r\n .ant-page-header-back-button {\r\n height: 100%;\r\n padding: 0 6px !important;\r\n display: flex !important;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n }\r\n\r\n .ant-page-header-heading-title {\r\n font-size: 14px;\r\n }\r\n `\r\n );\r\n const contentStyle = computed(\r\n () => css`\r\n padding: 10px 10px\r\n ${slots.bottomFooter ? \"50px\" : \"0\"};\r\n background: ${token.value.colorBgLayout};\r\n `\r\n );\r\n const footerStyle = computed(\r\n () => css`\r\n position: fixed;\r\n right: 0;\r\n bottom: 0;\r\n height: 50px;\r\n left: ${layout.value.collapsed\r\n ? layout.value.collapsedWidth\r\n : layout.value.sideWidth}px;\r\n z-index: 10;\r\n padding: 10px;\r\n background: ${modeConfig.value.mode !== \"light\"\r\n ? token.value.colorBgContainer\r\n : \"#fff\"};\r\n box-shadow: 6px 0 10px rgba(0, 0, 0, 0.15);\r\n transition: left 0.4s\r\n cubic-bezier(0.22, 1.2, 0.36, 1);\r\n `\r\n );\r\n const pageTitle = () => (\r\n <div>{route.meta.title \|\| \"无标题\"}</div>\r\n );\r\n const ghost = ref(false);\r\n\r\n const onBack = () => {\r\n if (props.close) {\r\n // 返回关闭标签\r\n deleteTabs(route.fullPath);\r\n router.go(-1);\r\n } else {\r\n // 不关闭标签\r\n router.go(-1);\r\n }\r\n };\r\n\r\n const onClosePage = () => {\r\n refresh.value = true;\r\n deleteTabs(route.fullPath);\r\n router.go(-1);\r\n };\r\n\r\n expose({\r\n close: onClosePage\r\n });\r\n\r\n return () => (\r\n <Watermark content={watermarkContent.value}>\r\n <Flex vertical={true}>\r\n <PageHeader\r\n ghost={ghost.value}\r\n class={pageHeaderStyle.value}\r\n onBack={() => onBack()}\r\n title={pageTitle()}\r\n >\r\n {{\r\n backIcon: () => (\r\n <div>\r\n <LeftOutlined\r\n style={{ fontSize: \"26px\" }}\r\n />\r\n </div>\r\n ),\r\n extra: () => slots.extra?.(),\r\n footer: () => slots.footer?.(),\r\n subTitle: () => slots.subTitle?.()\r\n }}\r\n </PageHeader>\r\n\r\n <div class={contentStyle.value}>\r\n {loading.value ? (\r\n <div></div>\r\n ) : (\r\n slots.default?.()\r\n )}\r\n </div>\r\n\r\n {slots.bottomFooter ? (\r\n <div class={footerStyle.value}>\r\n {slots.bottomFooter?.()}\r\n </div>\r\n ) : null}\r\n </Flex>\r\n </Watermark>\r\n );\r\n }\r\n});\r\n\r\nexport default show;\r\n"],"names":["getProps","close","type","Boolean","default","loading","show","defineComponent","name","props","setup","slots","expose","useToken","theme","appContext","inject","AppContextKey","watermarkContent","computed","value","content","token","layout","modeConfig","refresh","storeToRefs","useAppStore","deleteTabs","useNavTabStore","route","useRoute","router","useRouter","y","useWindowScroll","pageHeaderStyle","css","headerHeight","colorBgLayout","contentStyle","bottomFooter","footerStyle","collapsed","collapsedWidth","sideWidth","mode","colorBgContainer","pageTitle","_createVNode","meta","title","ghost","ref","onBack","fullPath","go","onClosePage","Watermark","Flex","PageHeader","backIcon","LeftOutlined","fontSize","extra","_a","footer","subTitle"],"mappings":"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"}
1	+ {"version":3,"file":"Show.mjs","sources":["../../../../src/components/layout/Show.tsx"],"sourcesContent":["import {\r\n computed,\r\n ComputedRef,\r\n defineComponent,\r\n inject,\r\n ref\r\n} from \"vue\";\r\nimport { useRoute, useRouter } from \"vue-router\";\r\nimport {\r\n Flex,\r\n PageHeader,\r\n Spin,\r\n theme,\r\n Watermark\r\n} from \"ant-design-vue\";\r\nimport { storeToRefs } from \"pinia\";\r\nimport { useWindowScroll } from \"@vueuse/core\";\r\n\r\nimport { AppContext, AppContextKey } from \"./AppContext\";\r\nimport { LeftOutlined } from \"@ant-design/icons-vue\";\r\nimport { useAppStore, useNavTabStore } from \"@ditari/store\";\r\nimport { css, cx } from \"@emotion/css\";\r\nimport type { GlobalToken } from \"ant-design-vue/es/theme/interface\";\r\n\r\nimport { useDesign } from \"../../hooks/useDesign\";\r\n\r\nconst getProps = () => {\r\n return {\r\n close: {\r\n type: Boolean,\r\n default: false\r\n },\r\n loading: {\r\n type: Boolean,\r\n default: false\r\n },\r\n loadingText: {\r\n type: String,\r\n default: \"正在请求...\"\r\n }\r\n };\r\n};\r\nconst show = defineComponent({\r\n name: \"DShowLayout\",\r\n props: getProps(),\r\n setup(props, { slots, expose }) {\r\n const { useToken } = theme;\r\n\r\n const appContext = inject<AppContext \| null>(\r\n AppContextKey,\r\n null\r\n );\r\n\r\n const { getPrefixCls } = useDesign(\"show-layout\");\r\n // 生成语义化类名\r\n const rootCls = getPrefixCls();\r\n\r\n const watermarkContent = computed(\r\n () => appContext?.watermarkContent?.value.content\r\n );\r\n\r\n const { token }: { token: ComputedRef<GlobalToken> } =\r\n useToken();\r\n\r\n const loading = computed(() => props.loading);\r\n const loadingText = computed(() => props.loadingText);\r\n\r\n const { layout, modeConfig, refresh } =\r\n storeToRefs(useAppStore());\r\n const { deleteTabs } = useNavTabStore();\r\n\r\n const route = useRoute();\r\n const router = useRouter();\r\n\r\n const { y } = useWindowScroll();\r\n\r\n const pageHeaderStyle = computed(\r\n () => css`\r\n position: sticky;\r\n top: ${layout.value.headerHeight}px;\r\n z-index: 10;\r\n padding: 0;\r\n transition: all 0.3s;\r\n background-color: ${token.value.colorBgLayout};\r\n\r\n ${y.value > 0\r\n ? \"box-shadow:0 10px 10px rgba(0, 0, 0, 0.15);\"\r\n : \"\"}\r\n .ant-page-header-back {\r\n height: 100%;\r\n margin-right: 0;\r\n\r\n .ant-page-header-back-button {\r\n height: 100%;\r\n padding: 0 6px !important;\r\n display: flex !important;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n }\r\n\r\n .ant-page-header-heading-title {\r\n font-size: 14px;\r\n }\r\n `\r\n );\r\n const contentStyle = computed(\r\n () => css`\r\n padding: 10px 10px\r\n ${slots.bottomFooter ? \"50px\" : \"0\"};\r\n background: ${token.value.colorBgLayout};\r\n `\r\n );\r\n const footerStyle = computed(\r\n () => css`\r\n position: fixed;\r\n right: 0;\r\n bottom: 0;\r\n height: 50px;\r\n left: ${layout.value.collapsed\r\n ? layout.value.collapsedWidth\r\n : layout.value.sideWidth}px;\r\n z-index: 10;\r\n padding: 10px;\r\n background: ${modeConfig.value.mode !== \"light\"\r\n ? token.value.colorBgContainer\r\n : \"#fff\"};\r\n box-shadow: 6px 0 10px rgba(0, 0, 0, 0.15);\r\n transition: left 0.4s\r\n cubic-bezier(0.22, 1.2, 0.36, 1);\r\n `\r\n );\r\n const pageTitle = () => (\r\n <div>{route.meta.title \|\| \"无标题\"}</div>\r\n );\r\n const ghost = ref(false);\r\n\r\n const onBack = () => {\r\n if (props.close) {\r\n // 返回关闭标签\r\n deleteTabs(route.fullPath);\r\n router.go(-1);\r\n } else {\r\n // 不关闭标签\r\n router.go(-1);\r\n }\r\n };\r\n\r\n const onClosePage = () => {\r\n refresh.value = true;\r\n deleteTabs(route.fullPath);\r\n router.go(-1);\r\n };\r\n\r\n expose({\r\n close: onClosePage\r\n });\r\n\r\n function showContent() {\r\n return (\r\n <div\r\n class={cx(rootCls)}\r\n style={{\r\n display: !loading.value ? \"block\" : \"none\"\r\n }}\r\n >\r\n <Watermark content={watermarkContent.value}>\r\n <Flex vertical={true}>\r\n <PageHeader\r\n ghost={ghost.value}\r\n class={pageHeaderStyle.value}\r\n onBack={() => onBack()}\r\n title={pageTitle()}\r\n >\r\n {{\r\n backIcon: () => (\r\n <div>\r\n <LeftOutlined\r\n style={{ fontSize: \"26px\" }}\r\n />\r\n </div>\r\n ),\r\n extra: () => slots.extra?.(),\r\n footer: () => slots.footer?.(),\r\n subTitle: () => slots.subTitle?.()\r\n }}\r\n </PageHeader>\r\n\r\n <div class={contentStyle.value}>\r\n {slots.default?.()}\r\n </div>\r\n\r\n {slots.bottomFooter ? (\r\n <div class={footerStyle.value}>\r\n {slots.bottomFooter?.()}\r\n </div>\r\n ) : null}\r\n </Flex>\r\n </Watermark>\r\n </div>\r\n );\r\n }\r\n\r\n function loadingContent() {\r\n return (\r\n <div\r\n style={{\r\n height: \"100%\",\r\n display: loading.value ? \"block\" : \"none\"\r\n }}\r\n >\r\n <div\r\n style={{\r\n height: \"100%\",\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\"\r\n }}\r\n >\r\n {slots.loading ? (\r\n slots.loading()\r\n ) : (\r\n <Spin tip={loadingText.value}></Spin>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n return () => (\r\n <div style={{ height: \"100%\" }}>\r\n {showContent()}\r\n {loadingContent()}\r\n </div>\r\n );\r\n }\r\n});\r\n\r\nexport default show;\r\n"],"names":["getProps","close","type","Boolean","default","loading","loadingText","String","show","defineComponent","name","props","setup","slots","expose","useToken","theme","appContext","inject","AppContextKey","getPrefixCls","useDesign","rootCls","watermarkContent","computed","value","content","token","layout","modeConfig","refresh","storeToRefs","useAppStore","deleteTabs","useNavTabStore","route","useRoute","router","useRouter","y","useWindowScroll","pageHeaderStyle","css","headerHeight","colorBgLayout","contentStyle","bottomFooter","footerStyle","collapsed","collapsedWidth","sideWidth","mode","colorBgContainer","pageTitle","_createVNode","meta","title","ghost","ref","onBack","fullPath","go","onClosePage","showContent","cx","display","Watermark","Flex","PageHeader","backIcon","LeftOutlined","fontSize","extra","_a","footer","subTitle","loadingContent","height","justifyContent","alignItems","Spin"],"mappings":"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"}

package/dist/esm/components/layout/components/layout/HeaderLayout.vue2.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
-import { defineComponent, ref, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createBlock, createVNode, renderSlot } from 'vue';
+import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createBlock, createVNode, renderSlot } from 'vue';
 import { theme } from 'ant-design-vue';
-import { getActivePinia, storeToRefs } from 'pinia';
+import { storeToRefs } from 'pinia';
 import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons-vue';
 import { useAppStore } from '@ditari/store';
 import { css } from '@emotion/css';
@@ -11,29 +11,8 @@ import _sfc_main$1 from '../../../tab/Tab.vue2.mjs';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "HeaderLayout",
   setup(__props) {
-    const pinia = getActivePinia();
-    const appStore = pinia ? useAppStore() : null;
-    const defaultLayout = {
-      sideWidth: 200,
-      headerHeight: 44,
-      collapsedWidth: 80,
-      collapsed: false
-    };
-    const defaultModeConfig = {
-      mode: "light",
-      list: [
-        { value: "light", label: "\u4EAE\u8272" },
-        { value: "dark", label: "\u6DF1\u8272" },
-        { value: "os", label: "\u8DDF\u968F\u7CFB\u7EDF" }
-      ]
-    };
-    const defaultHeaderTokenStyle = {
-      bgColor: "#1677ff",
-      txtColor: "#fff"
-    };
-    const layout = appStore ? storeToRefs(appStore).layout : ref(defaultLayout);
-    const modeConfig = appStore ? storeToRefs(appStore).modeConfig : ref(defaultModeConfig);
-    const headerTokenStyle = appStore ? storeToRefs(appStore).headerTokenStyle : ref(defaultHeaderTokenStyle);
+    const appStore = useAppStore();
+    const { layout, modeConfig, headerTokenStyle } = storeToRefs(appStore);
     const {
       headerStyle,
       headerTabStyle,
@@ -52,7 +31,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       top: 0;
       right: 0;
       z-index: 1;
-      background-color: ${modeConfig.value.mode !== "light" ? token.value.colorBgContainer : headerTokenStyle.value.bgColor};
+      background-color: ${modeConfig.value.mode !== "light" ? token.value.colorBgContainer : headerTokenStyle.value.colorBgHeader};
       left: ${left.value};
       height: ${layout.value.headerHeight}px;
       transition: left 0.4s cubic-bezier(0.22, 1.2, 0.36, 1);
@@ -75,7 +54,6 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       align-items: center;
       justify-content: center;
       cursor: pointer;
-      color: ${modeConfig.value.mode === "light" ? headerTokenStyle.value.txtColor : "inherit"};
     `
       );
       const rightStyle2 = computed(

package/dist/esm/components/layout/components/layout/HeaderLayout.vue2.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderLayout.vue2.mjs","sources":["../../../../../../src/components/layout/components/layout/HeaderLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed, type ComputedRef, ~~ref~~ } from \"vue\";\r\nimport { theme } from \"ant-design-vue\";\r\nimport { ~~getActivePinia,~~ storeToRefs } from \"pinia\";\r\n\r\nimport {\r\n MenuFoldOutlined,\r\n MenuUnfoldOutlined\r\n} from \"@ant-design/icons-vue\";\r\nimport { useAppStore } from \"@ditari/store\";\r\nimport { css } from \"@emotion/css\";\r\nimport type { GlobalToken } from \"ant-design-vue/es/theme/interface\";\r\n\r\nimport Tab from \"../../../tab/Tab.vue\";\r\n\r\~~n// 检查 Pinia 是否可用\r\~~nconst ~~pinia = getActivePinia();\r\nconst~~ appStore = ~~pinia ?~~ useAppStore() ~~: null~~;\r\n\r\~~n// 提供默认值当 Pinia 不可用时\r\~~nconst ~~defaultLayout =~~ {~~\r\n sideWidth:~~ ~~200,\r\n headerHeight: 44,\r\n collapsedWidth: 80,\r\n collapsed: false\r\n};\r\n\r\nconst defaultModeConfig = {\r\n mode: \"light\",\r\n list: [\r\n { value: \"light\"~~, ~~label: \"亮色\" },\r\n { value: \"dark\"~~, ~~label:~~ ~~\"深色\"~~ }~~,\r\n {~~ ~~value: \"os\", label: \"跟随系统\" }\~~r\n ~~]\r\n};\r\n\r\nconst defaultHeaderTokenStyle = {\r\n bgColor: \"#1677ff\",\r\n txtColor: \"#fff\"\r\n};\r\n\r\nconst layout = appStore ?~~ storeToRefs(appStore)~~.layout : ref(defaultLayout)~~;\r\nconst modeConfig = appStore ? storeToRefs(appStore).modeConfig : ref(defaultModeConfig);\r\nconst headerTokenStyle = appStore ? storeToRefs(appStore).headerTokenStyle : ref(defaultHeaderTokenStyle);\r\n\r\nconst {\r\n headerStyle,\r\n headerTabStyle,\r\n collapsedStyle,\r\n rightStyle\r\n} = useStyle();\r\n\r\nfunction useStyle(): {\r\n headerStyle: ComputedRef<string>;\r\n headerTabStyle: ComputedRef<string>;\r\n collapsedStyle: ComputedRef<string>;\r\n rightStyle: ComputedRef<string>;\r\n} {\r\n const { useToken } = theme;\r\n const { token }: { token: ComputedRef<GlobalToken> } =\r\n useToken();\r\n\r\n const left = computed(\r\n () =>\r\n `${layout.value.collapsed ? layout.value.collapsedWidth : layout.value.sideWidth}px`\r\n );\r\n\r\n const headerStyle = computed(\r\n () => css`\r\n position: fixed;\r\n top: 0;\r\n right: 0;\r\n z-index: 1;\r\n background-color: ${modeConfig.value.mode !== \"light\"\r\n ? token.value.colorBgContainer\r\n : headerTokenStyle.value.~~bgColor~~};\r\n left: ${left.value};\r\n height: ${layout.value.headerHeight}px;\r\n transition: left 0.4s cubic-bezier(0.22, 1.2, 0.36, 1);\r\n display: flex;\r\n align-items: flex-end;\r\n `\r\n );\r\n\r\n const headerTabStyle = computed(\r\n () => css`\r\n flex: 1;\r\n overflow: hidden;\r\n padding-right: 10px;\r\n `\r\n );\r\n\r\n const collapsedStyle = computed(\r\n () => css`\r\n padding: 0 10px;\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n ~~color: ${modeConfig.value.mode === \"light\"\r\n ? headerTokenStyle.value.txtColor\r\n : \"inherit\"};\r\n~~ `\r\n );\r\n\r\n const rightStyle = computed(\r\n () => css`\r\n height: 100%;\r\n `\r\n );\r\n\r\n return {\r\n headerStyle,\r\n headerTabStyle,\r\n collapsedStyle,\r\n rightStyle\r\n };\r\n}\r\n</script>\r\n~~\r\n~~<template>\r\n <div :class=\"[headerStyle, 'app-header-layout']\">\r\n <div\r\n :class=\"collapsedStyle\"\r\n @click=\"layout.collapsed = !layout.collapsed\"\r\n >\r\n <menu-unfold-outlined\r\n v-if=\"layout.collapsed\"\r\n class=\"trigger\"\r\n />\r\n <menu-fold-outlined v-else />\r\n </div>\r\n <div :class=\"headerTabStyle\">\r\n <Tab />\r\n </div>\r\n <div :class=\"rightStyle\">\r\n <slot></slot>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<style scoped></style>\r\n"],"names":["headerStyle","headerTabStyle","collapsedStyle","rightStyle","_createElementBlock","_unref","_createElementVNode","_createBlock","_createVNode","Tab","_renderSlot"],"mappings":";;;;;;;;;;;;;AAgBA,IAAA,MAAM,~~QAAQ~~,~~cAAA,EAAe;AAC7B,IAAA,MAAM,QAAA,GAAW,KAAA,GAAQ,~~WAAA,EAAY~~,GAAI,IAAA~~;~~AAGzC~~,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,SAAA,EAAW,GAAA;AAAA,MACX,YAAA,EAAc,EAAA;AAAA,MACd,cAAA,EAAgB,EAAA;AAAA,MAChB,SAAA,EAAW;AAAA,KACb;AAEA,IAAA,MAAM,iBAAA,GAAoB;AAAA,MACxB,IAAA,EAAM,OAAA;AAAA,MACN,IAAA,EAAM;AAAA,QACJ,EAAE,~~KAAA,EAAO,OAAA,EAAS,KAAA,EAAO,cAAA,EAAK;AAAA,QAC9B,EAAE,KAAA,EAAO,~~MAAA,EAAQ,KAAA,EAAO,cAAA,EAAK;AAAA,QAC7B,EAAE,KAAA,EAAO,IAAA,EAAM,KAAA,EAAO,0BAAA;AAAO;AAC/B,KACF;AAEA,IAAA,MAAM,uBAAA,GAA0B;AAAA,MAC9B,OAAA,EAAS,SAAA;AAAA,MACT,QAAA,EAAU;AAAA,KACZ;AAEA,IAAA,MAAM,SAAS,QAAA,GAAW,WAAA,CAAY,QAAQ,CAAA,CAAE,MAAA,GAAS,IAAI,aAAa,CAAA;AAC1E,IAAA,MAAM,aAAa,QAAA,GAAW,WAAA,CAAY,QAAQ,CAAA,CAAE,UAAA,~~GAAa~~,~~IAAI~~,~~iBAAiB~~,~~CAAA;AACtF~~,~~IAAA~~,~~MAAM,mBAAmB,QAAA,GAAW,WAAA,CAAY,~~QAAQ,CAAA~~,CAAE,gBAAA,GAAmB,IAAI,uBAAuB,CAAA~~;~~AAExG~~,IAAA,MAAM;AAAA,MACJ,WAAA;AAAA,MACA,cAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA,QACE,QAAA,EAAS;AAEb,IAAA,SAAS,QAAA,GAKP;AACA,MAAA,MAAM,EAAE,UAAS,GAAI,KAAA;AACrB,MAAA,MAAM,EAAE,KAAA,EAAM,GACZ,QAAA,EAAS;AAEX,MAAA,MAAM,IAAA,GAAO,QAAA;AAAA,QACX,MACE,CAAA,EAAG,MAAA,CAAO,KAAA,CAAM,SAAA,GAAY,OAAO,KAAA,CAAM,cAAA,GAAiB,MAAA,CAAO,KAAA,CAAM,SAAS,CAAA,EAAA;AAAA,OACpF;AAEA,MAAA,MAAMA,YAAAA,GAAc,QAAA;AAAA,QAClB,MAAM,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAA,EAKgB,UAAA,CAAW,MAAM,IAAA,KAAS,OAAA,GAC1C,MAAM,KAAA,CAAM,gBAAA,GACZ,gBAAA,CAAiB,KAAA,CAAM,~~OAAO~~,CAAA;AAAA,YAAA,~~EAC1B~~,KAAK,KAAK,CAAA;AAAA,cAAA,EACR,MAAA,CAAO,MAAM,YAAY,CAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,OAKvC;AAEA,MAAA,MAAMC,eAAAA,GAAiB,QAAA;AAAA,QACrB,MAAM,GAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,OAKR;AAEA,MAAA,MAAMC,eAAAA,GAAiB,QAAA;AAAA,QACrB,MAAM,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~aAAA,EAOK,WAAW,KAAA,CAAM,~~IAAA~~,KAAS,UAC/B,gBAAA,CAAiB,KAAA,CAAM,WACvB,SAAS,CAAA~~;AAAA,~~IAAA~~;~~AAAA,OAEjB;~~AAEA,MAAA,MAAMC,WAAAA,GAAa,QAAA;AAAA,QACjB,MAAM,GAAA;AAAA;AAAA,IAAA;AAAA,OAGR;AAEA,MAAA,OAAO;AAAA,QACL,WAAA,EAAAH,YAAAA;AAAA,QACA,cAAA,EAAAC,eAAAA;AAAA,QACA,cAAA,EAAAC,eAAAA;AAAA,QACA,UAAA,EAAAC;AAAA,OACF;AAAA,IACF;;~~0BAIEC~~,kBAAA;AAAA,QAiBM,KAAA;AAAA,QAAA;AAAA,UAjBA,uBAAQC,MAAA,WAAA,CAAA,EAAW,mBAAA,CAAA;AAAA;;UACvBC,kBAAA;AAAA,YASM,KAAA;AAAA,YAAA;AAAA,cARH,KAAA,iBAAOD,KAAA,CAAA,cAAA,CAAc,CAAA;AAAA,cACrB,+CAAOA,KAAA,CAAA,MAAA,CAAA,CAAO,SAAA,GAAS,CAAIA,KAAA,CAAA,MAAA,CAAA,CAAO,SAAA;AAAA;;cAG3BA,KAAA,CAAA,MAAA,CAAA,CAAO,SAAA,iBADfE,WAAA,CAGEF,KAAA,CAAA,kBAAA,CAAA,EAAA;AAAA;gBADA,KAAA,EAAM;AAAA,kCAERE,WAAA,CAA6BF,KAAA,CAAA,gBAAA,CAAA,EAAA,EAAA,GAAA,EAAA,CAAA,EAAA,CAAA;AAAA;;;;UAE/BC,kBAAA;AAAA,YAEM,KAAA;AAAA,YAAA;AAAA,cAFA,KAAA,iBAAOD,KAAA,CAAA,cAAA,CAAc;AAAA;;cACzBG,YAAOC,WAAA;AAAA;;;;UAETH,kBAAA;AAAA,YAEM,KAAA;AAAA,YAAA;AAAA,cAFA,KAAA,iBAAOD,KAAA,CAAA,UAAA,CAAU;AAAA;;cACrBK,UAAA,CAAa,IAAA,CAAA,MAAA,EAAA,SAAA;AAAA;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"HeaderLayout.vue2.mjs","sources":["../../../../../../src/components/layout/components/layout/HeaderLayout.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed, type ComputedRef } from \"vue\";\r\nimport { theme } from \"ant-design-vue\";\r\nimport { storeToRefs } from \"pinia\";\r\n\r\nimport {\r\n MenuFoldOutlined,\r\n MenuUnfoldOutlined\r\n} from \"@ant-design/icons-vue\";\r\nimport { useAppStore } from \"@ditari/store\";\r\nimport { css } from \"@emotion/css\";\r\nimport type { GlobalToken } from \"ant-design-vue/es/theme/interface\";\r\nimport type { RouteLocationNormalized } from \"vue-router\";\r\n\r\nimport Tab from \"../../../tab/Tab.vue\";\r\n\r\nconst appStore = useAppStore();\r\n\r\nconst { layout, modeConfig, headerTokenStyle } =\r\n storeToRefs(appStore);\r\n\r\nconst {\r\n headerStyle,\r\n headerTabStyle,\r\n collapsedStyle,\r\n rightStyle\r\n} = useStyle();\r\n\r\nfunction useStyle(): {\r\n headerStyle: ComputedRef<string>;\r\n headerTabStyle: ComputedRef<string>;\r\n collapsedStyle: ComputedRef<string>;\r\n rightStyle: ComputedRef<string>;\r\n} {\r\n const { useToken } = theme;\r\n const { token }: { token: ComputedRef<GlobalToken> } =\r\n useToken();\r\n\r\n const left = computed(\r\n () =>\r\n `${layout.value.collapsed ? layout.value.collapsedWidth : layout.value.sideWidth}px`\r\n );\r\n\r\n const headerStyle = computed(\r\n () => css`\r\n position: fixed;\r\n top: 0;\r\n right: 0;\r\n z-index: 1;\r\n background-color: ${modeConfig.value.mode !== \"light\"\r\n ? token.value.colorBgContainer\r\n : headerTokenStyle.value.colorBgHeader};\r\n left: ${left.value};\r\n height: ${layout.value.headerHeight}px;\r\n transition: left 0.4s cubic-bezier(0.22, 1.2, 0.36, 1);\r\n display: flex;\r\n align-items: flex-end;\r\n `\r\n );\r\n\r\n const headerTabStyle = computed(\r\n () => css`\r\n flex: 1;\r\n overflow: hidden;\r\n padding-right: 10px;\r\n `\r\n );\r\n\r\n const collapsedStyle = computed(\r\n () => css`\r\n padding: 0 10px;\r\n height: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n `\r\n );\r\n\r\n const rightStyle = computed(\r\n () => css`\r\n height: 100%;\r\n `\r\n );\r\n\r\n return {\r\n headerStyle,\r\n headerTabStyle,\r\n collapsedStyle,\r\n rightStyle\r\n };\r\n}\r\n</script>\r\n<template>\r\n <div :class=\"[headerStyle, 'app-header-layout']\">\r\n <div\r\n :class=\"collapsedStyle\"\r\n @click=\"layout.collapsed = !layout.collapsed\"\r\n >\r\n <menu-unfold-outlined\r\n v-if=\"layout.collapsed\"\r\n class=\"trigger\"\r\n />\r\n <menu-fold-outlined v-else />\r\n </div>\r\n <div :class=\"headerTabStyle\">\r\n <Tab />\r\n </div>\r\n <div :class=\"rightStyle\">\r\n <slot></slot>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<style scoped></style>\r\n"],"names":["headerStyle","headerTabStyle","collapsedStyle","rightStyle","_createElementBlock","_unref","_createElementVNode","_createBlock","_createVNode","Tab","_renderSlot"],"mappings":";;;;;;;;;;;;;AAgBA,IAAA,MAAM,WAAW,WAAA,EAAY;AAE7B,IAAA,MAAM,EAAE,MAAA,EAAQ,UAAA,EAAY,gBAAA,EAAiB,GAC3C,YAAY,QAAQ,CAAA;AAEtB,IAAA,MAAM;AAAA,MACJ,WAAA;AAAA,MACA,cAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA,QACE,QAAA,EAAS;AAEb,IAAA,SAAS,QAAA,GAKP;AACA,MAAA,MAAM,EAAE,UAAS,GAAI,KAAA;AACrB,MAAA,MAAM,EAAE,KAAA,EAAM,GACZ,QAAA,EAAS;AAEX,MAAA,MAAM,IAAA,GAAO,QAAA;AAAA,QACX,MACE,CAAA,EAAG,MAAA,CAAO,KAAA,CAAM,SAAA,GAAY,OAAO,KAAA,CAAM,cAAA,GAAiB,MAAA,CAAO,KAAA,CAAM,SAAS,CAAA,EAAA;AAAA,OACpF;AAEA,MAAA,MAAMA,YAAAA,GAAc,QAAA;AAAA,QAClB,MAAM,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAA,EAKgB,UAAA,CAAW,MAAM,IAAA,KAAS,OAAA,GAC1C,MAAM,KAAA,CAAM,gBAAA,GACZ,gBAAA,CAAiB,KAAA,CAAM,aAAa,CAAA;AAAA,YAAA,EAChC,KAAK,KAAK,CAAA;AAAA,cAAA,EACR,MAAA,CAAO,MAAM,YAAY,CAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,OAKvC;AAEA,MAAA,MAAMC,eAAAA,GAAiB,QAAA;AAAA,QACrB,MAAM,GAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,OAKR;AAEA,MAAA,MAAMC,eAAAA,GAAiB,QAAA;AAAA,QACrB,MAAM,GAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA;AAAA,OAQR;AAEA,MAAA,MAAMC,WAAAA,GAAa,QAAA;AAAA,QACjB,MAAM,GAAA;AAAA;AAAA,IAAA;AAAA,OAGR;AAEA,MAAA,OAAO;AAAA,QACL,WAAA,EAAAH,YAAAA;AAAA,QACA,cAAA,EAAAC,eAAAA;AAAA,QACA,cAAA,EAAAC,eAAAA;AAAA,QACA,UAAA,EAAAC;AAAA,OACF;AAAA,IACF;;0BAGEC,kBAAA;AAAA,QAiBM,KAAA;AAAA,QAAA;AAAA,UAjBA,uBAAQC,MAAA,WAAA,CAAA,EAAW,mBAAA,CAAA;AAAA;;UACvBC,kBAAA;AAAA,YASM,KAAA;AAAA,YAAA;AAAA,cARH,KAAA,iBAAOD,KAAA,CAAA,cAAA,CAAc,CAAA;AAAA,cACrB,+CAAOA,KAAA,CAAA,MAAA,CAAA,CAAO,SAAA,GAAS,CAAIA,KAAA,CAAA,MAAA,CAAA,CAAO,SAAA;AAAA;;cAG3BA,KAAA,CAAA,MAAA,CAAA,CAAO,SAAA,iBADfE,WAAA,CAGEF,KAAA,CAAA,kBAAA,CAAA,EAAA;AAAA;gBADA,KAAA,EAAM;AAAA,kCAERE,WAAA,CAA6BF,KAAA,CAAA,gBAAA,CAAA,EAAA,EAAA,GAAA,EAAA,CAAA,EAAA,CAAA;AAAA;;;;UAE/BC,kBAAA;AAAA,YAEM,KAAA;AAAA,YAAA;AAAA,cAFA,KAAA,iBAAOD,KAAA,CAAA,cAAA,CAAc;AAAA;;cACzBG,YAAOC,WAAA;AAAA;;;;UAETH,kBAAA;AAAA,YAEM,KAAA;AAAA,YAAA;AAAA,cAFA,KAAA,iBAAOD,KAAA,CAAA,UAAA,CAAU;AAAA;;cACrBK,UAAA,CAAa,IAAA,CAAA,MAAA,EAAA,SAAA;AAAA;;;;;;;;;;;;;;"}