vben
2020-11-10 4ff6b73c2bb57764db2bcd8212d82f028e25e36d
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
import {
  DoubleRightOutlined,
  DoubleLeftOutlined,
  MenuUnfoldOutlined,
  MenuFoldOutlined,
} from '@ant-design/icons-vue';
import { defineComponent } from 'vue';
 
// store
import { menuStore } from '/@/store/modules/menu';
 
export default defineComponent({
  name: 'LayoutTrigger',
  props: {
    sider: {
      type: Boolean,
      default: true,
    },
    theme: {
      type: String,
    },
  },
  setup(props) {
    function toggleMenu() {
      menuStore.commitCollapsedState(!menuStore.getCollapsedState);
    }
 
    return () => {
      const siderTrigger = menuStore.getCollapsedState ? (
        <DoubleRightOutlined />
      ) : (
        <DoubleLeftOutlined />
      );
      if (props.sider) return siderTrigger;
 
      return (
        <span class={['layout-trigger', props.theme]} onClick={toggleMenu}>
          {menuStore.getCollapsedState ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
        </span>
      );
    };
  },
});