@opentiny/vue-renderless/tree-select/index.js

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

import {
  __spreadProps,
  __spreadValues
} from "../chunk-G2ADBYYC.js";
import { find } from "@opentiny/utils";
const filter = ({ vm }) => (value) => {
  vm.$refs.treeRef.filter(value);
};
const nodeClick = ({ props, vm, emit }) => (data) => {
  if (!props.multiple) {
    vm.$refs.baseSelectRef.updateSelectedData(__spreadProps(__spreadValues({}, data), {
      currentLabel: data[props.textField],
      value: data[props.valueField],
      state: {
        currentLabel: data[props.textField]
      }
    }));
    emit("change", data[props.valueField]);
    emit("update:modelValue", data[props.valueField]);
    vm.$refs.baseSelectRef.hidePanel();
  }
};
const check = ({ props, vm, emit }) => (data, { checkedNodes }) => {
  if (props.multiple) {
    const currentValue = [];
    vm.$refs.baseSelectRef.updateSelectedData(
      checkedNodes.map((node) => {
        currentValue.push(node[props.valueField]);
        return __spreadProps(__spreadValues({}, node), {
          currentLabel: node[props.textField],
          value: node[props.valueField]
        });
      })
    );
    emit("change", currentValue);
    emit("update:modelValue", currentValue);
  }
};
const getTreeData = ({ props, state }) => (data) => {
  const nodes = [];
  const getChild = (data2, pId) => {
    data2.forEach((node) => {
      node.pId = pId;
      nodes.push(node);
      if (node[state.childrenName] && node[state.childrenName].length > 0) {
        getChild(node[state.childrenName], node[props.valueField]);
      }
    });
  };
  getChild(data, null);
  return nodes;
};
const getPluginOption = ({ api, props, state }) => (value) => {
  const isRemote = (props.filterable || props.searchable) && props.remote && (typeof props.remoteMethod === "function" || typeof props.initQuery === "function");
  const { textField, valueField } = props;
  const sourceData = isRemote ? state.remoteData : api.getTreeData(state.treeData);
  const selNode = find(sourceData, (item) => item[valueField] === value);
  const items = [];
  if (selNode) {
    selNode.currentLabel = selNode[textField];
    items.push(selNode);
  }
  return items;
};
const getCheckedData = ({ props, state }) => (selected) => {
  const checkedKey = [];
  if (!Array.isArray(selected)) {
    return props.modelValue ? [props.modelValue] : [selected[props.valueField]];
  } else {
    selected.length > 0 && selected.forEach((item) => {
      checkedKey.push(item[props.valueField]);
    });
    return checkedKey;
  }
};
const getChildValue = () => (childNodes, key) => {
  const ids = [];
  const getChild = (nodes) => {
    nodes.forEach((node) => {
      ids.push(node.data[key]);
      if (node.childNodes.length > 0) {
        getChild(node.childNodes);
      }
    });
  };
  getChild(childNodes);
  return ids;
};
const mounted = ({ api, state, props, vm }) => () => {
  if (!state.modelValue || state.modelValue.length === 0)
    return;
  if (props.multiple) {
    let initialNodes = [];
    if (Array.isArray(state.modelValue)) {
      state.modelValue.forEach((value) => {
        const option = api.getPluginOption(value);
        initialNodes = initialNodes.concat(option);
      });
    }
    const selected = initialNodes.map((node) => {
      return __spreadProps(__spreadValues({}, node), {
        currentLabel: node[props.textField],
        value: node[props.valueField]
      });
    });
    vm.$refs.baseSelectRef.updateSelectedData(selected);
    state.defaultCheckedKeys = api.getCheckedData(selected);
  } else {
    const data = api.getPluginOption(state.modelValue)[0];
    vm.$refs.baseSelectRef.updateSelectedData(__spreadProps(__spreadValues({}, data), {
      currentLabel: data[props.textField],
      value: data[props.valueField],
      state: {
        currentLabel: data[props.textField]
      }
    }));
    state.currentKey = data[props.valueField];
  }
};
const watchValue = ({ api, props, vm, state }) => (newValue, oldValue) => {
  if (props.multiple) {
    const xorResult = oldValue.filter((item) => !newValue.includes(item));
    const tagId = xorResult[0];
    const treeIds = [tagId];
    let checkedKeys = newValue;
    if (xorResult.length === 1 && !props.treeOp.checkStrictly) {
      let node = vm.$refs.treeRef.getNode(tagId);
      if (!node.isLeaf) {
        treeIds.push(...api.getChildValue(node.childNodes, props.valueField));
      }
      while (node.parent && !Array.isArray(node.parent.data)) {
        node.parent.data && treeIds.push(node.parent.data[props.valueField]);
        node = node.parent;
      }
      checkedKeys = newValue.filter((item) => !treeIds.includes(item));
    }
    let initialNodes = [];
    if (Array.isArray(checkedKeys)) {
      checkedKeys.forEach((value) => {
        const option = api.getPluginOption(value);
        initialNodes = initialNodes.concat(option);
      });
    }
    const selected = initialNodes.map((node) => {
      return __spreadProps(__spreadValues({}, node), {
        currentLabel: node[props.textField],
        value: node[props.valueField]
      });
    });
    vm.$refs.baseSelectRef.updateSelectedData(selected);
    vm.$refs.treeRef.setCheckedKeys(checkedKeys);
  }
};
export {
  check,
  filter,
  getCheckedData,
  getChildValue,
  getPluginOption,
  getTreeData,
  mounted,
  nodeClick,
  watchValue
};