yanzhen-design-vue
Version:
181 lines (180 loc) • 8.36 kB
JavaScript
import { defineComponent, toRefs, ref, unref, onUnmounted, openBlock, createBlock, normalizeClass, withCtx, createElementBlock, renderSlot, createCommentVNode, createVNode, toDisplayString, Fragment, renderList, mergeProps, createSlots } from "vue";
import { Flex, Spin, Collapse } from "ant-design-vue";
import { YzList } from "../../../list/index.mjs";
import { createWatcher } from "@yanzhen-libs/utils-vue";
import "../item/contacts-item.vue.mjs";
import { useContactsSelectedGroup } from "../hook/use-contacts-selected-data.mjs";
import { contactsItemOmitProps } from "../item/contacts-item.mjs";
import { contactsGroupName, contactsGroupProps, contactsGroupEmits, contactsGroupOptions } from "./contacts-group.mjs";
import _sfc_main$1 from "../item/contacts-item.vue2.mjs";
const _hoisted_1 = { key: 1 };
const _sfc_main = /* @__PURE__ */ defineComponent({
...{
name: contactsGroupName
},
__name: "contacts-group",
props: contactsGroupProps,
emits: contactsGroupEmits,
setup(__props, { emit: __emit }) {
const { ns } = contactsGroupOptions;
const props = __props;
const emit = __emit;
const { disableIds, dataSource } = toRefs(props);
const activeKey = ref();
const { selectedGroup } = useContactsSelectedGroup(dataSource);
const watcher = createWatcher();
watcher.set("activeKey", {
source: () => unref(dataSource).length,
handler() {
if (!props.allExpand) {
const list = [...unref(selectedGroup)].reverse();
const find = list.find(
({ value, children }) => value !== "-1" && children && children.length > 0
);
activeKey.value = find == null ? void 0 : find.value;
} else {
activeKey.value = [...unref(selectedGroup)].map(({ value }) => value);
}
},
immediate: true,
deep: true,
debounce: 1e3
});
function handleItemClick(item) {
if (props.onItemClick) {
props.onItemClick(item);
} else {
emit("item-click", item);
}
}
function handleSuffixClick(item) {
if (props.onSuffixClick) {
props.onSuffixClick(item);
} else {
emit("suffix-click", item);
}
}
onUnmounted(() => {
watcher.stop();
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(Flex), {
vertical: "",
class: normalizeClass([unref(ns).b()]),
gap: 10
}, {
default: withCtx(() => [
_ctx.$slots.title ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass([unref(ns).e("selected-title")])
}, [
renderSlot(_ctx.$slots, "title")
], 2)) : createCommentVNode("", true),
createVNode(unref(Flex), {
flex: 1,
class: normalizeClass([unref(ns).e("main")])
}, {
default: withCtx(() => [
Boolean(_ctx.$slots.loading || props.loading) ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass([unref(ns).e("main-loading")])
}, [
_ctx.$slots.loading ? renderSlot(_ctx.$slots, "loading", { key: 0 }) : (openBlock(), createBlock(unref(Spin), { key: 1 }))
], 2)) : createCommentVNode("", true),
Boolean(_ctx.$slots.empty || props.emptyText) && unref(dataSource).length === 0 ? (openBlock(), createElementBlock("div", {
key: 1,
class: normalizeClass([unref(ns).e("main-empty")])
}, [
_ctx.$slots.empty ? renderSlot(_ctx.$slots, "empty", { key: 0 }) : (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(props.emptyText), 1))
], 2)) : createCommentVNode("", true),
createVNode(unref(Collapse), {
"active-key": activeKey.value,
"onUpdate:activeKey": _cache[0] || (_cache[0] = ($event) => activeKey.value = $event),
class: normalizeClass([unref(ns).e("collapse")]),
"expand-icon-position": "end",
ghost: true,
accordion: false,
bordered: false,
"destroy-inactive-panel": false
}, {
default: withCtx(() => [
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(selectedGroup), (item) => {
return openBlock(), createElementBlock(Fragment, null, [
item.children.length > 0 ? (openBlock(), createBlock(unref(Collapse).Panel, {
key: item.value,
header: item.label
}, {
default: withCtx(() => [
createVNode(unref(YzList), {
class: normalizeClass([unref(ns).e("list-item")]),
loading: false,
"data-source": item.children,
height: "auto"
}, {
default: withCtx(({ item: listItem }) => {
var _a, _b;
return [
listItem ? (openBlock(), createBlock(_sfc_main$1, mergeProps({
key: listItem.value,
type: listItem.type,
style: listItem.style,
ref_for: true
}, unref(contactsItemOmitProps)(listItem), {
class: [
{
[unref(ns).is("item-hover")]: props.onItemClick,
[unref(ns).is("item-suffix-hover")]: props.onSuffixClick,
[unref(ns).is("disabled")]: unref(disableIds).includes(item.value)
},
listItem.class
],
onItemClick: ($event) => handleItemClick(listItem),
onSuffixClick: ($event) => handleSuffixClick(listItem)
}), createSlots({ _: 2 }, [
((_a = _ctx.$slots) == null ? void 0 : _a.default) ? {
name: "default",
fn: withCtx((slotProps) => [
renderSlot(_ctx.$slots, "default", mergeProps({
panel: item,
item: listItem,
ref_for: true
}, slotProps ?? {}))
]),
key: "0"
} : void 0,
((_b = _ctx.$slots) == null ? void 0 : _b.suffix) ? {
name: "suffix",
fn: withCtx((slotProps) => [
renderSlot(_ctx.$slots, "suffix", mergeProps({
panel: item,
item: listItem,
ref_for: true
}, slotProps ?? {}))
]),
key: "1"
} : void 0
]), 1040, ["type", "style", "class", "onItemClick", "onSuffixClick"])) : createCommentVNode("", true)
];
}),
_: 2
}, 1032, ["class", "data-source"])
]),
_: 2
}, 1032, ["header"])) : createCommentVNode("", true)
], 64);
}), 256))
]),
_: 3
}, 8, ["active-key", "class"])
]),
_: 3
}, 8, ["class"])
]),
_: 3
}, 8, ["class"]);
};
}
});
export {
_sfc_main as default
};