Blame view

src/layouts/default/multitabs/TabContent.tsx 1.85 KB
陈文彬 authored
1
import type { PropType } from 'vue';
vben authored
2
import { Dropdown } from '/@/components/Dropdown/index';
vben authored
3
vben authored
4
import { defineComponent, unref, FunctionalComponent } from 'vue';
5
vben authored
6
import { TabContentProps } from './types';
陈文彬 authored
7
8
import { RightOutlined } from '@ant-design/icons-vue';
陈文彬 authored
9
vben authored
10
11
import { TabContentEnum } from './types';
陈文彬 authored
12
import { useTabDropdown } from './useTabDropdown';
vben authored
13
import { useI18n } from '/@/hooks/web/useI18n';
14
vben authored
15
16
import { RouteLocationNormalized } from 'vue-router';
vben authored
17
18
const { t: titleT } = useI18n();
19
20
21
22
23
24
25
26
const ExtraContent: FunctionalComponent = () => {
  return (
    <span class={`multiple-tabs-content__extra `}>
      <RightOutlined />
    </span>
  );
};
vben authored
27
28
29
const TabContent: FunctionalComponent<{ tabItem: RouteLocationNormalized; handler: Fn }> = (
  props
) => {
30
31
32
  const { tabItem: { meta } = {} } = props;

  return (
vben authored
33
    <div class={`multiple-tabs-content__content `} onContextmenu={props.handler(props.tabItem)}>
vben authored
34
      <span class="ml-1">{meta && titleT(meta.title)}</span>
35
36
37
    </div>
  );
};
陈文彬 authored
38
39
40
41
42

export default defineComponent({
  name: 'TabContent',
  props: {
    tabItem: {
vben authored
43
      type: Object as PropType<RouteLocationNormalized>,
陈文彬 authored
44
45
      default: null,
    },
46
陈文彬 authored
47
    type: {
48
      type: Number as PropType<TabContentEnum>,
陈文彬 authored
49
50
51
52
      default: TabContentEnum.TAB_TYPE,
    },
  },
  setup(props) {
vben authored
53
54
55
56
57
58
59
    const {
      getDropMenuList,
      handleMenuEvent,
      handleContextMenu,
      getTrigger,
      isTabs,
    } = useTabDropdown(props as TabContentProps);
陈文彬 authored
60
61
62
63

    return () => {
      return (
        <Dropdown
vben authored
64
65
          dropMenuList={unref(getDropMenuList)}
          trigger={unref(getTrigger)}
陈文彬 authored
66
67
          onMenuEvent={handleMenuEvent}
        >
vben authored
68
69
70
71
72
73
          {() => {
            if (!unref(isTabs)) {
              return <ExtraContent />;
            }
            return <TabContent handler={handleContextMenu} tabItem={props.tabItem} />;
          }}
陈文彬 authored
74
75
76
77
78
        </Dropdown>
      );
    };
  },
});