Blame view

src/layouts/default/feature/index.vue 2.54 KB
vben authored
1
<script lang="ts">
2
  import { defineComponent, computed, unref } from 'vue';
vben authored
3
  import { BackTop } from 'ant-design-vue';
4
vben authored
5
  import { useRootSetting } from '/@/hooks/setting/useRootSetting';
6
7
  import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
  import { useDesign } from '/@/hooks/web/useDesign';
8
  import { useUserStoreWithOut } from '/@/store/modules/user';
9
10
11

  import { SettingButtonPositionEnum } from '/@/enums/appEnum';
  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
vben authored
12
13
  import SessionTimeoutLogin from '/@/views/sys/login/SessionTimeoutLogin.vue';
14
vben authored
15
16
17
18
19
  export default defineComponent({
    name: 'LayoutFeatures',
    components: {
      BackTop,
      LayoutLockPage: createAsyncComponent(() => import('/@/views/sys/lock/index.vue')),
20
      SettingDrawer: createAsyncComponent(() => import('/@/layouts/default/setting/index.vue')),
21
      SessionTimeoutLogin,
vben authored
22
23
    },
    setup() {
24
25
      const { getUseOpenBackTop, getShowSettingButton, getSettingButtonPosition, getFullContent } =
        useRootSetting();
26
      const userStore = useUserStoreWithOut();
27
      const { prefixCls } = useDesign('setting-drawer-feature');
28
29
      const { getShowHeader } = useHeaderSetting();
30
31
      const getIsSessionTimeout = computed(() => userStore.getSessionTimeout);
32
33
34
35
36
37
38
39
40
41
42
      const getIsFixedSettingDrawer = computed(() => {
        if (!unref(getShowSettingButton)) {
          return false;
        }
        const settingButtonPosition = unref(getSettingButtonPosition);

        if (settingButtonPosition === SettingButtonPositionEnum.AUTO) {
          return !unref(getShowHeader) || unref(getFullContent);
        }
        return settingButtonPosition === SettingButtonPositionEnum.FIXED;
      });
vben authored
43
44
45
46

      return {
        getTarget: () => document.body,
        getUseOpenBackTop,
47
48
        getIsFixedSettingDrawer,
        prefixCls,
49
        getIsSessionTimeout,
vben authored
50
51
52
53
      };
    },
  });
</script>
54
55
56
57
58

<template>
  <LayoutLockPage />
  <BackTop v-if="getUseOpenBackTop" :target="getTarget" />
  <SettingDrawer v-if="getIsFixedSettingDrawer" :class="prefixCls" />
59
  <SessionTimeoutLogin v-if="getIsSessionTimeout" />
60
61
62
</template>

<style lang="less">
63
  @prefix-cls: ~'@{namespace}-setting-drawer-feature';
64
65

  .@{prefix-cls} {
vben authored
66
    display: flex;
67
    position: absolute;
vben authored
68
    z-index: 10;
69
70
    top: 45%;
    right: 0;
vben authored
71
72
    align-items: center;
    justify-content: center;
73
    padding: 10px;
vben authored
74
75
    border-radius: 6px 0 0 6px;
    background-color: @primary-color;
76
77
78
79
80
81
82
83
84
    color: @white;
    cursor: pointer;

    svg {
      width: 1em;
      height: 1em;
    }
  }
</style>