yuang-framework-ui-pc
Version:
yuang-framework-ui-pc Library
91 lines (90 loc) • 2.94 kB
JavaScript
"use strict";
const vue = require("vue");
const elementPlus = require("element-plus");
const icons = require("../../icons");
const hook = require("../../utils/hook");
const EleDropdown = require("../../ele-dropdown/index");
const EleTabTool = require("../../ele-tab-tool/index");
const _sfc_main = vue.defineComponent({
name: "TabDropdown",
components: { ElIcon: elementPlus.ElIcon, ArrowDown: icons.ArrowDown, EleDropdown, EleTabTool },
props: {
/** 右键菜单 */
items: Array,
/** 右键菜单属性 */
dropdownProps: Object,
/** 是否点击后自动关闭菜单 */
autoClose: {
type: Boolean,
default: true
}
},
emits: {
menuClick: (_command) => true
},
setup(props, { emit }) {
const [startAutoCloseTimer] = hook.useTimer(150);
const dropdownRef = vue.ref(null);
const handleCommand = (command) => {
emit("menuClick", command);
if (props.autoClose) {
startAutoCloseTimer(() => {
if (dropdownRef.value) {
dropdownRef.value.handleClose();
}
});
}
};
return { dropdownRef, handleCommand };
}
});
const _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
const _hoisted_1 = { style: { "text-align": "center", "outline": "none" } };
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_ArrowDown = vue.resolveComponent("ArrowDown");
const _component_ElIcon = vue.resolveComponent("ElIcon");
const _component_EleDropdown = vue.resolveComponent("EleDropdown");
const _component_EleTabTool = vue.resolveComponent("EleTabTool");
return vue.openBlock(), vue.createBlock(_component_EleTabTool, null, {
default: vue.withCtx(() => [
vue.createVNode(_component_EleDropdown, vue.mergeProps({
placement: "bottom-end",
popperClass: "ele-tab-popup",
popperOptions: {
modifiers: [{ name: "offset", options: { offset: [12, 8] } }]
}
}, _ctx.dropdownProps || {}, {
ref: "dropdownRef",
items: _ctx.items,
componentType: "pro",
onCommand: _ctx.handleCommand
}), {
default: vue.withCtx(() => [
vue.createElementVNode("div", _hoisted_1, [
vue.renderSlot(_ctx.$slots, "icon", {}, () => [
vue.createVNode(_component_ElIcon, {
class: "ele-tab-icon",
style: { "vertical-align": "-3px" }
}, {
default: vue.withCtx(() => [
vue.createVNode(_component_ArrowDown)
]),
_: 1
})
])
])
]),
_: 3
}, 16, ["items", "onCommand"])
]),
_: 3
});
}
const tabDropdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
module.exports = tabDropdown;