tav-ui
Version:
192 lines (189 loc) • 7.18 kB
JavaScript
import { defineComponent, ref, computed, watch, resolveComponent, openBlock, createElementBlock, renderSlot, createCommentVNode, createBlock, withCtx, createTextVNode, toDisplayString, normalizeClass, createVNode, withModifiers, Fragment, renderList, normalizeProps, guardReactiveProps } from 'vue';
import { Dropdown, Menu, Input } from 'ant-design-vue';
import { useDebounceFn } from '@vueuse/core';
import { propTypes } from '../../../utils/propTypes2.mjs';
import { TaBasicTitle } from '../../basic-title/index2.mjs';
import { TaIcon } from '../../icon/index2.mjs';
import '../../../locales/index2.mjs';
import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
import { tavI18n } from '../../../locales/transfer2.mjs';
var ToolbarEnum = /* @__PURE__ */ ((ToolbarEnum2) => {
ToolbarEnum2[ToolbarEnum2["SELECT_ALL"] = 0] = "SELECT_ALL";
ToolbarEnum2[ToolbarEnum2["UN_SELECT_ALL"] = 1] = "UN_SELECT_ALL";
ToolbarEnum2[ToolbarEnum2["EXPAND_ALL"] = 2] = "EXPAND_ALL";
ToolbarEnum2[ToolbarEnum2["UN_EXPAND_ALL"] = 3] = "UN_EXPAND_ALL";
ToolbarEnum2[ToolbarEnum2["CHECK_STRICTLY"] = 4] = "CHECK_STRICTLY";
ToolbarEnum2[ToolbarEnum2["CHECK_UN_STRICTLY"] = 5] = "CHECK_UN_STRICTLY";
return ToolbarEnum2;
})(ToolbarEnum || {});
const _sfc_main = defineComponent({
name: "BasicTreeHeader",
components: {
BasicTitle: TaBasicTitle,
Icon: TaIcon,
Dropdown,
Menu,
MenuItem: Menu.Item,
MenuDivider: Menu.Divider,
InputSearch: Input.Search
},
props: {
helpMessage: {
type: [String, Array],
default: ""
},
title: propTypes.string,
toolbar: propTypes.bool,
checkable: propTypes.bool,
search: propTypes.bool,
checkAll: propTypes.func,
expandAll: propTypes.func,
searchText: propTypes.string,
onStrictlyChange: propTypes.func
},
emits: ["strictly-change", "search"],
setup(props, { emit, slots }) {
const searchValue = ref("");
const getInputSearchCls = computed(() => {
const titleExists = slots.headerTitle || props.title;
return [
"mr-1",
"w-full",
{
["ml-5"]: titleExists
}
];
});
const toolbarList = computed(() => {
const { checkable } = props;
const defaultToolbarList = [
{ label: tavI18n("Tav.tree.1"), value: 2 },
{
label: tavI18n("Tav.tree.2"),
value: 3,
divider: checkable
}
];
return checkable ? [
{ label: tavI18n("Tav.tree.3"), value: 0 },
{
label: tavI18n("Tav.tree.4"),
value: 1,
divider: checkable
},
...defaultToolbarList,
{ label: tavI18n("Tav.tree.5"), value: 4 },
{ label: tavI18n("Tav.tree.6"), value: 5 }
] : defaultToolbarList;
});
function handleMenuClick(e) {
const { key } = e;
switch (key) {
case 0:
props.checkAll?.(true);
break;
case 1:
props.checkAll?.(false);
break;
case 2:
props.expandAll?.(true);
break;
case 3:
props.expandAll?.(false);
break;
case 4:
emit("strictly-change", false);
break;
case 5:
emit("strictly-change", true);
break;
}
}
function emitChange(value) {
emit("search", value);
}
const debounceEmitChange = useDebounceFn(emitChange, 200);
watch(() => props.searchText, (v) => {
if (v !== searchValue.value) {
searchValue.value = v;
}
});
function handleSearch(e) {
debounceEmitChange(e);
}
return { tavI18n, toolbarList, handleMenuClick, searchValue, getInputSearchCls, handleSearch };
}
});
const _hoisted_1 = { class: "flex px-2 py-1.5 items-center basic-tree-header" };
const _hoisted_2 = {
key: 2,
class: "flex flex-1 justify-self-stretch items-center cursor-pointer"
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_BasicTitle = resolveComponent("BasicTitle");
const _component_InputSearch = resolveComponent("InputSearch");
const _component_Icon = resolveComponent("Icon");
const _component_MenuItem = resolveComponent("MenuItem");
const _component_MenuDivider = resolveComponent("MenuDivider");
const _component_Menu = resolveComponent("Menu");
const _component_Dropdown = resolveComponent("Dropdown");
return openBlock(), createElementBlock("div", _hoisted_1, [
_ctx.$slots.headerTitle ? renderSlot(_ctx.$slots, "headerTitle", { key: 0 }) : createCommentVNode("v-if", true),
!_ctx.$slots.headerTitle && _ctx.title ? (openBlock(), createBlock(_component_BasicTitle, {
key: 1,
"help-message": _ctx.helpMessage
}, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.title), 1)
]),
_: 1
}, 8, ["help-message"])) : createCommentVNode("v-if", true),
_ctx.search || _ctx.toolbar ? (openBlock(), createElementBlock("div", _hoisted_2, [
_ctx.search ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(_ctx.getInputSearchCls)
}, [
createVNode(_component_InputSearch, {
value: _ctx.searchValue,
"onUpdate:value": _cache[0] || (_cache[0] = ($event) => _ctx.searchValue = $event),
placeholder: _ctx.tavI18n("Tav.common.searchText"),
"allow-clear": "",
onSearch: _ctx.handleSearch
}, null, 8, ["value", "placeholder", "onSearch"])
], 2)) : createCommentVNode("v-if", true),
_ctx.toolbar ? (openBlock(), createBlock(_component_Dropdown, {
key: 1,
onClick: _cache[1] || (_cache[1] = withModifiers(() => {
}, ["prevent"]))
}, {
overlay: withCtx(() => [
createVNode(_component_Menu, { onClick: _ctx.handleMenuClick }, {
default: withCtx(() => [
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.toolbarList, (item) => {
return openBlock(), createElementBlock(Fragment, {
key: item.value
}, [
createVNode(_component_MenuItem, normalizeProps(guardReactiveProps({ key: item.value })), {
default: withCtx(() => [
createTextVNode(toDisplayString(item.label), 1)
]),
_: 2
}, 1040),
item.divider ? (openBlock(), createBlock(_component_MenuDivider, { key: 0 })) : createCommentVNode("v-if", true)
], 64);
}), 128))
]),
_: 1
}, 8, ["onClick"])
]),
default: withCtx(() => [
createVNode(_component_Icon, { icon: "ion:ellipsis-vertical" })
]),
_: 1
})) : createCommentVNode("v-if", true)
])) : createCommentVNode("v-if", true)
]);
}
var TreeHeader = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/tav-ui/tav-ui/packages/components/tree/src/TreeHeader.vue"]]);
export { TreeHeader as default };
//# sourceMappingURL=TreeHeader2.mjs.map