数通智联化工云平台
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1 line
12 KiB

2 years ago
{"version":3,"file":"tabs.mjs","sources":["../../../../../../packages/components/tabs/src/tabs.tsx"],"sourcesContent":["import {\n computed,\n defineComponent,\n getCurrentInstance,\n nextTick,\n provide,\n ref,\n renderSlot,\n watch,\n} from 'vue'\nimport {\n buildProps,\n definePropType,\n isNumber,\n isString,\n isUndefined,\n} from '@element-plus/utils'\nimport { EVENT_CODE, UPDATE_MODEL_EVENT } from '@element-plus/constants'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons-vue'\nimport {\n useDeprecated,\n useNamespace,\n useOrderedChildren,\n} from '@element-plus/hooks'\nimport { tabsRootContextKey } from './constants'\nimport TabNav from './tab-nav'\n\nimport type { TabNavInstance } from './tab-nav'\nimport type { TabsPaneContext } from './constants'\nimport type { ExtractPropTypes } from 'vue'\nimport type { Awaitable } from '@element-plus/utils'\n\nexport type TabPaneName = string | number\n\nexport const tabsProps = buildProps({\n type: {\n type: String,\n values: ['card', 'border-card', ''],\n default: '',\n },\n activeName: {\n type: [String, Number],\n },\n closable: Boolean,\n addable: Boolean,\n modelValue: {\n type: [String, Number],\n },\n editable: Boolean,\n tabPosition: {\n type: String,\n values: ['top', 'right', 'bottom', 'left'],\n default: 'top',\n },\n beforeLeave: {\n type: definePropType<\n (newName: TabPaneName, oldName: TabPaneName) => Awaitable<void | boolean>\n >(Function),\n default: () => true,\n },\n stretch: Boolean,\n} as const)\nexport type TabsProps = ExtractPropTypes<typeof tabsProps>\n\nconst isPaneName = (value: unknown): value is string | number =>\n isString(value) || isNumber(value)\n\nexport const tabsEmits = {\n [UPDATE_MODEL_EVENT]: (name: TabPaneName) => isPaneName(name),\n tabClick: (pane: TabsPaneContext, ev: Event) => ev instanceof Event,\n tabChange: (name: TabPaneName) => isPaneName(name),\n edit: (paneName: TabPaneName | undefined, action: 'remove' | 'add') =>\n ['remove', 'add'].includes(action),\n tabRemove: (name: TabPaneName) => isPaneName(name),\n tabAdd: () => true,\n}\nexport type TabsEmits = typeof tabsEmits\n\nexport type TabsPanes = Record<number, TabsPaneContext>\n\nconst Tabs = defineComponent({\n name: 'ElTabs',\n\n props: tabsProps,\n emits: tabsEmits,\n\n setup(props, { emit, slots, expose }) {\n const ns = useNamespace('tabs')\n\n const {\n children: panes,\n addChild: registerPane,\n removeChild: unregisterPane,\n } = useOrderedChildren<TabsPaneContext>(getCurrentInstance()!, 'ElTabPane')\n\n const nav$ = ref<TabNavInstance>()\n const currentName = ref<TabPaneName>(\n props.modelValue ?? props.activeName ?? '0'\n )\n\n const setCurrentName = async (value?: TabPaneName, trigger = false) => {\n // should do nothing.\n if (currentName.value === value || isUndefined(value)) return\n\n try {\n const canLeave = await props.beforeLeave?.(value, currentName.value)\n if (canLeave !== false) {\n currentName.value = value\n if (trigger) {\n emit(UPDATE_MODEL_EVENT, value)\n emit('tabChange', value)\n }\n\n nav$.value?.removeFocus?.()\n }\n } catch {}\n }\n\n const handleTabClick = (\n tab: TabsPaneContext,\n tabName: TabPaneName,\n event: Event\n ) => {\n if (tab.props.disabled) return\n setCurrentName(tabName, true)\n emit('tabClick', tab, event)\n }\n\n const handleTabRemove = (pane: TabsPaneContext, ev: Event) => {\n if (pane.props.disabled || isUndefined(pane.props.name)) return\n ev.stopPropagation()\n emit('edit', pane.props.name, 'remove')\n emit('tabRemove', pane.props.name)\n }\n\n const handleTabAdd = () => {\n emit('edit', undefined, 'add')\n emit('tabAdd')\n }\n\n useDeprecated(\n {\n from: '\"activeName\"',\n replacement: '\"model-value\" or \"v-model\"',\n scope: 'ElTabs',\