{"version":3,"file":"tree-select.vue.mjs","sources":["../../../../../../packages/components/tree-select/src/tree-select.vue"],"sourcesContent":["<script lang=\"ts\">\n  import type { WritableComputedRef } from 'vue'\n  import { computed, defineComponent, nextTick, ref, watch } from 'vue'\n  import { getComponentNamespace, getNamespace } from '../../../utils/global-config'\n  import Trigger from '../../trigger/src/trigger'\n  import SelectTrigger from '../../common/select-trigger.vue'\n  import { Scrollbar } from '../../scrollbar'\n  import type { TreeData, TreeInstance } from '../../tree'\n  import { Tree } from '../../tree'\n  import { Empty } from '../../empty'\n  import { BnIconEmpty } from '../../icon'\n  import { debounce } from '../../../utils/throttle-debounce'\n\n  // 表单\n  import { useFormItem } from '../../form/src/hooks/use-form-item'\n  import { NOOP } from '../../../shared/utils'\n  import { treeSelectProps } from './props'\n\n  export default defineComponent({\n    name: getComponentNamespace('TreeSelect'),\n    components: {\n      Trigger,\n      SelectTrigger,\n      Scrollbar,\n      Tree,\n      Empty,\n      BnIconEmpty\n    },\n    props: treeSelectProps,\n    emits: ['update:modelValue', 'show', 'hide', 'change', 'clear'],\n    setup(props, { emit }) {\n      const ns = getNamespace('tree-select')\n\n      const popupVisible = ref(false)\n\n      const mergeDisabled = computed(() => props.disabled)\n      const mergeSize = computed(() => props.size)\n      const placeholder = computed(() => props.placeholder)\n\n      const changePopupVisible = (visible: boolean) => {\n        popupVisible.value = visible\n      }\n\n      const popupRef = ref<HTMLElement>()\n      const inputValue = ref('')\n      const multipleTags = ref<\n        {\n          key: string\n          label: string\n        }[]\n      >([])\n\n      const isEmpty = computed(() => props.data.length === 0)\n\n      // tree\n      const treeRef = ref<TreeInstance>()\n      const modelType = computed(() => (props.multiple ? 'checked' : 'selected'))\n      const selected: WritableComputedRef<(number | string)[]> = computed({\n        get() {\n          return props.modelValue\n        },\n        set(val) {\n          emit('update:modelValue', val)\n        }\n      })\n      const treeDataCache = ref<TreeData[]>([])\n      const treeRenderData = ref<TreeData[]>([])\n\n      const onChangeChecked = (values: (number | string)[]) => {\n        selected.value = values\n        emit('change', values)\n      }\n\n      const onChangeSelected = (values: (number | string)[]) => {\n        selected.value = values\n        emit('change', values)\n        changePopupVisible(false)\n      }\n      const treeBindEvents = computed(() => {\n        const events: Record<string, (values: (number | string)[]) => void> = {}\n        if (props.multiple) {\n          events.changeChecked = onChangeChecked\n        } else {\n          events.changeSelected = onChangeSelected\n        }\n        return events\n      })\n      // 表单验证\n      const { formItem } = useFormItem()\n\n      watch(\n        () => selected.value,\n        async (values) => {\n          await nextTick()\n          const nodes = treeRef.value?.getNodesByValues(values)\n          if (!props.multiple) {\n            inputValue.value = nodes?.[0]?.label as string\n          } else {\n            multipleTags.value = nodes?.map((node) => {\n              return {\n                key: node.value,\n                label: node.label\n              }\n            }) as {\n              key: string\n              label: string\n            }[]\n          }\n        },\n        { immediate: true }\n      )\n\n      watch(\n        () => props.data,\n        (newData) => {\n          treeDataCache.value = newData.slice()\n          treeRenderData.value = newData.slice()\n        },\n        { immediate: true }\n      )\n\n      const onShow = () => {\n        emit('show')\n      }\n      const onHide = () => {\n        emit('hide')\n      }\n      const handleClear = () => {\n        emit('update:modelValue', [])\n        emit('clear')\n        emit('change', [])\n      }\n      const handleTagClose = (tag: { key: string; label: string }) => {\n        const tags = multipleTags.value.slice()\n        const originSelectedValues = selected.value.slice()\n        const key = tag.key\n        const index = tags.findIndex((tag) => tag.key === key)\n        if (~index) {\n          tags.splice(index, 1)\n          originSelectedValues.splice(index, 1)\n          multipleTags.value = tags\n\n          emit('update:modelValue', originSelectedValues)\n\n          emit('change', originSelectedValues)\n        }\n      }\n\n      const handleFilter = debounce(\n        (query: string) => {\n          const stack = treeDataCache.value.slice()\n          if (!query) {\n            treeRenderData.value = stack\n            return\n          }\n\n          const matcher: TreeData[] = []\n          const filterMethod = props.filterMethod\n\n          while (stack.length) {\n            const item = stack.shift() as TreeData\n            const RE = new RegExp(`${query}`, 'ig')\n            let existing = true\n\n            if (filterMethod) {\n              existing = filterMethod(treeRef.value?.getNodesByValues([item.value])[0], query)\n            } else {\n              existing = RE.test(item.label as string)\n            }\n\n            if (existing) {\n              matcher.push(item)\n            } else {\n              const children = item?.children\n              if (children) {\n                for (let i = 0; i < children.length; i++) {\n                  stack.push(children[i])\n                }\n              }\n            }\n          }\n          treeRenderData.value = matcher\n\n          nextTick(() => {\n            treeRef.value?.unfoldNodes()\n          })\n        },\n        0,\n        true\n      )\n\n      const handleShowPopup = () => {\n        changePopupVisible(true)\n      }\n\n      // 表单验证\n      watch(\n        () => selected.value,\n        () => {\n          if (props.validateEvent) {\n            formItem?.validate('change').catch(NOOP)\n          }\n        }\n      )\n      const stopEvent = (event: Event) => {\n        console.log('EVENT_', event)\n\n        // 阻止事件的默认行为\n        event.preventDefault()\n        // 阻止事件传播\n        event.stopPropagation()\n        // 阻止事件捕获和冒泡\n        event.stopImmediatePropagation()\n      }\n      return {\n        ns,\n        popupVisible,\n        mergeDisabled,\n        mergeSize,\n        placeholder,\n        popupRef,\n        isEmpty,\n\n        multipleTags,\n        inputValue,\n\n        treeRef,\n        selected,\n        modelType,\n        treeRenderData,\n        treeBindEvents,\n\n        onShow,\n        onHide,\n        handleClear,\n        handleTagClose,\n        handleFilter,\n        handleShowPopup,\n\n        stopEvent\n      }\n    }\n  })\n</script>\n\n<template>\n  <div :class=\"ns\">\n    <Trigger\n      v-model:popup-visible=\"popupVisible\"\n      position=\"bl\"\n      trigger=\"click\"\n      :unmount-on-close=\"false\"\n      animation-name=\"bn-slide-dynamic-origin\"\n      auto-fit-popup-min-width\n      :popup-offset=\"8\"\n      :disabled=\"mergeDisabled\"\n      @show=\"onShow\"\n      @hide=\"onHide\"\n    >\n      <template #default>\n        <SelectTrigger\n          :input-value=\"inputValue\"\n          :disabled=\"mergeDisabled\"\n          :size=\"mergeSize\"\n          :placeholder=\"placeholder\"\n          :clearable=\"clearable\"\n          :popup-visible=\"popupVisible\"\n          :multiple=\"multiple\"\n          :multiple-tags=\"multipleTags\"\n          :filterable=\"filterable\"\n          :popup-ref=\"popupRef\"\n          :card=\"card\"\n          :max-tag=\"maxTag\"\n          @clear=\"handleClear\"\n          @tag-close=\"handleTagClose\"\n          @filter=\"handleFilter\"\n          @show=\"handleShowPopup\"\n        />\n      </template>\n\n      <template #content>\n        <div ref=\"popupRef\" :class=\"[`${ns}__menu`, popupClass]\">\n          <Scrollbar v-if=\"!isEmpty\" style=\"max-height: 224px\">\n            <Tree\n              ref=\"treeRef\"\n              :[modelType]=\"selected\"\n              :data=\"treeRenderData\"\n              :multiple=\"multiple\"\n              :unfold-on-click-node=\"unfoldOnClickNode\"\n              :checked-on-click-node=\"checkedOnClickNode\"\n              :show-checkbox=\"modelType === 'checked'\"\n              :check-strictly=\"checkStrictly\"\n              :show-line=\"showLine\"\n              :default-unfold-all=\"defaultUnfoldAll\"\n              :default-unfold-values=\"defaultUnfoldValues\"\n              :accordion=\"accordion\"\n              v-on=\"treeBindEvents\"\n            >\n              <template v-if=\"$slots['node-icon']\" #node-icon=\"scoped\">\n                <slot name=\"node-icon\" v-bind=\"scoped\"></slot>\n              </template>\n              <template v-if=\"$slots['node-label']\" #node-label=\"scoped\">\n                <slot name=\"node-label\" v-bind=\"scoped\"></slot>\n              </template>\n              <template v-if=\"$slots['node-extra']\" #node-extra=\"scoped\">\n                <slot name=\"node-extra\" v-bind=\"scoped\"></slot>\n              </template>\n            </Tree>\n          </Scrollbar>\n          <div v-if=\"isEmpty\" :class=\"[`${ns}__empty`]\">\n            <slot name=\"empty\">\n              <Empty :description=\"noDataText\">\n                <template #image>\n                  <BnIconEmpty size=\"38\" />\n                </template>\n              </Empty>\n            </slot>\n          </div>\n\n          <div v-if=\"!isEmpty && !treeRenderData.length\" :class=\"[`${ns}__empty`, 'is-no-matcher']\">\n            <slot name=\"empty\">\n              <Empty description=\"暂无匹配项\">\n                <template #image>\n                  <BnIconEmpty size=\"38\" />\n                </template>\n              </Empty>\n            </slot>\n          </div>\n        </div>\n      </template>\n    </Trigger>\n  </div>\n</template>\n"],"names":["_resolveComponent","_normalizeClass","onShow","onHide","_withCtx","inputValue","mergeDisabled","mergeSize","placeholder","clearable","popupVisible","multiple","multipleTags","filterable","popupRef","card","maxTag","handleClear","handleTagClose","handleFilter","handleShowPopup","_createElementVNode","isEmpty","_createBlock","_createVNode","selected","modelType","checkStrictly","showLine","defaultUnfoldAll","accordion","treeBindEvents","$slots","_toHandlers","_createSlots","_createCommentVNode","_openBlock","_createElementBlock","ns","treeRenderData"],"mappings":"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"}