@fesjs/fes-design/es/transfer/useCheckValueWithCheckbox.js

fes-design for PC

import { ref } from 'vue';
import { calcCheckStatus } from './checkbox';

/** 数据是仅和其关联的 Checkbox 的值相关，与组件的 modelValue 无关 */
const useCheckValueWithCheckbox = _ref => {
  let {
    checkValue,
    options,
    onCheckboxChange
  } = _ref;
  const checkboxStatus = ref(calcCheckStatus(checkValue.value.length, options.value.length));

  // 处理组件的事件，而不是 watch 组件的 modelValue。防止 watch 之间互相依赖，循环触发
  const handleCheckboxChange = status => {
    if (status === 'some') {
      return;
    }
    checkValue.value = status === 'all' ? options.value.map(_ref2 => {
      let {
        value
      } = _ref2;
      return value;
    }) : [];
    onCheckboxChange === null || onCheckboxChange === void 0 || onCheckboxChange();
  };

  // 可能是 List 也可能是 Tree，取决于使用的组件
  const handleCheck = _ref3 => {
    let {
      checkedKeys
    } = _ref3;
    checkboxStatus.value = calcCheckStatus(checkedKeys.length, options.value.length);
  };
  return {
    checkboxStatus,
    handleCheckboxChange,
    handleCheck
  };
};

export { useCheckValueWithCheckbox };