update

init
2025-06-27 17:42:38 +08:00
commit bd6402478b
5317 changed files with 785994 additions and 0 deletions
@@ -0,0 +1,60 @@
+<template>
+    <Drawer
+        v-if="getIsMobile"
+        placement="left"
+        :class="prefixCls"
+        :width="getMenuWidth"
+        :getContainer="null"
+        :visible="!getCollapsed"
+        @close="handleClose"
+    >
+        <Sider />
+    </Drawer>
+    <MixSider v-else-if="getIsMixSidebar" />
+    <Sider v-else />
+</template>
+<script lang="ts">
+    import { defineComponent } from 'vue';
+
+    import Sider from './LayoutSider.vue';
+    import MixSider from './MixSider.vue';
+    import { Drawer } from 'ant-design-vue';
+
+    import { useAppInject } from '/@/hooks/web/useAppInject';
+    import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
+    import { useDesign } from '/@/hooks/web/useDesign';
+    export default defineComponent({
+        name: 'SiderWrapper',
+        components: { Sider, Drawer, MixSider },
+        setup() {
+            const { prefixCls } = useDesign('layout-sider-wrapper');
+            const { getIsMobile } = useAppInject();
+            const { setMenuSetting, getCollapsed, getMenuWidth, getIsMixSidebar } = useMenuSetting();
+
+            function handleClose() {
+                setMenuSetting({
+                    collapsed: true,
+                });
+            }
+
+            return { prefixCls, getIsMobile, getCollapsed, handleClose, getMenuWidth, getIsMixSidebar };
+        },
+    });
+</script>
+<style lang="less">
+    @prefix-cls: ~'@{namespace}-layout-sider-wrapper';
+
+    .@{prefix-cls} {
+        .ant-drawer-body {
+            height: 100vh;
+            padding: 0;
+        }
+
+        .ant-drawer-header-no-title {
+            display: none;
+        }
+    }
+    :deep(.ant-layout-sider-trigger) {
+        background-color: red;
+    }
+</style>