yuang-framework-ui-pc
Version:
yuang-framework-ui-pc Library
133 lines (132 loc) • 4.38 kB
JavaScript
import { defineComponent, resolveComponent, createBlock, openBlock, withCtx, createCommentVNode, renderSlot, createVNode, createSlots, normalizeProps, guardReactiveProps } from "vue";
import { ElIcon } from "element-plus";
import { HomeOutlined } from "../../icons";
import EleTabWrap from "../../ele-tab-wrap/index";
import EleTabTool from "../../ele-tab-tool/index";
import EleTabs from "../../ele-tabs/index";
const _sfc_main = defineComponent({
name: "LayoutTabs",
components: {
ElIcon,
HomeOutlined,
EleTabWrap,
EleTabTool,
EleTabs
},
props: {
/** 页签数据 */
tabs: Array,
/** 页签选中 */
active: String,
/** 是否需要固定的主页页签 */
fixedHome: Boolean,
/** 主页路由地址 */
homePath: String,
/** 当前路由是否是主页 */
isHome: Boolean,
/** 页签风格 */
tabStyle: String,
/** 是否支持右键菜单 */
tabContextMenu: [Boolean, Object],
/** 右键菜单 */
tabContextMenus: [Array, Function],
/** 是否支持拖动排序 */
tabSortable: Boolean
},
emits: {
tabClick: (_option) => true,
tabRemove: (_name) => true,
tabContextMenu: (_option) => true,
tabSortChange: (_data) => true
},
setup(_props, { emit }) {
const handleTabItemClick = (option) => {
emit("tabClick", option);
};
const handleTabRemove = (name) => {
emit("tabRemove", name);
};
const handleTabContextMenu = (option) => {
emit("tabContextMenu", option);
};
const handleTabSortChange = (data) => {
emit("tabSortChange", data);
};
return {
handleTabRemove,
handleTabItemClick,
handleTabContextMenu,
handleTabSortChange
};
}
});
const _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_HomeOutlined = resolveComponent("HomeOutlined");
const _component_ElIcon = resolveComponent("ElIcon");
const _component_EleTabTool = resolveComponent("EleTabTool");
const _component_EleTabs = resolveComponent("EleTabs");
const _component_EleTabWrap = resolveComponent("EleTabWrap");
return openBlock(), createBlock(_component_EleTabWrap, {
type: _ctx.tabStyle,
class: "ele-admin-tabs"
}, {
default: withCtx(() => [
_ctx.fixedHome ? (openBlock(), createBlock(_component_EleTabTool, {
key: 0,
tab: true,
active: _ctx.isHome,
tabName: _ctx.homePath
}, {
default: withCtx(() => [
renderSlot(_ctx.$slots, "tabHome", { active: _ctx.active }, () => [
createVNode(_component_ElIcon, {
class: "ele-tab-icon",
style: { "vertical-align": "-3px" }
}, {
default: withCtx(() => [
createVNode(_component_HomeOutlined, { style: { "transform": "scale(1.08)" } })
]),
_: 1
})
])
]),
_: 3
}, 8, ["active", "tabName"])) : createCommentVNode("", true),
_ctx.tabs ? (openBlock(), createBlock(_component_EleTabs, {
key: 1,
items: _ctx.tabs,
modelValue: _ctx.active,
sortable: _ctx.tabSortable,
contextMenu: _ctx.tabContextMenu,
contextMenus: _ctx.tabContextMenus,
mousewheel: true,
handleClick: true,
onTabRemove: _ctx.handleTabRemove,
onTabItemClick: _ctx.handleTabItemClick,
onTabContextMenu: _ctx.handleTabContextMenu,
onTabSortChange: _ctx.handleTabSortChange
}, createSlots({ _: 2 }, [
_ctx.$slots.tabTitle ? {
name: "label",
fn: withCtx((slotProps) => [
renderSlot(_ctx.$slots, "tabTitle", normalizeProps(guardReactiveProps(slotProps || {})))
]),
key: "0"
} : void 0
]), 1032, ["items", "modelValue", "sortable", "contextMenu", "contextMenus", "onTabRemove", "onTabItemClick", "onTabContextMenu", "onTabSortChange"])) : createCommentVNode("", true),
renderSlot(_ctx.$slots, "tabExtra", { active: _ctx.active })
]),
_: 3
}, 8, ["type"]);
}
const layoutTabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
export {
layoutTabs as default
};