c682835d1a263c6f254a7b8b86cbf36f5ad96e23616ea0662f03d06275a8760074bcb6d976252e231bba8db202eb30d3f1031b218600fb3cabffa5afda0aee 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. import { computed, watch } from 'vue';
  2. import { CHECKED_CHANGE_EVENT } from '../transfer-panel2.mjs';
  3. import { usePropsAlias } from './use-props-alias.mjs';
  4. import { isFunction } from '@vue/shared';
  5. const useCheck = (props, panelState, emit) => {
  6. const propsAlias = usePropsAlias(props);
  7. const filteredData = computed(() => {
  8. return props.data.filter((item) => {
  9. if (isFunction(props.filterMethod)) {
  10. return props.filterMethod(panelState.query, item);
  11. } else {
  12. const label = String(item[propsAlias.value.label] || item[propsAlias.value.key]);
  13. return label.toLowerCase().includes(panelState.query.toLowerCase());
  14. }
  15. });
  16. });
  17. const checkableData = computed(() => filteredData.value.filter((item) => !item[propsAlias.value.disabled]));
  18. const checkedSummary = computed(() => {
  19. const checkedLength = panelState.checked.length;
  20. const dataLength = props.data.length;
  21. const { noChecked, hasChecked } = props.format;
  22. if (noChecked && hasChecked) {
  23. return checkedLength > 0 ? hasChecked.replace(/\${checked}/g, checkedLength.toString()).replace(/\${total}/g, dataLength.toString()) : noChecked.replace(/\${total}/g, dataLength.toString());
  24. } else {
  25. return `${checkedLength}/${dataLength}`;
  26. }
  27. });
  28. const isIndeterminate = computed(() => {
  29. const checkedLength = panelState.checked.length;
  30. return checkedLength > 0 && checkedLength < checkableData.value.length;
  31. });
  32. const updateAllChecked = () => {
  33. const checkableDataKeys = checkableData.value.map((item) => item[propsAlias.value.key]);
  34. panelState.allChecked = checkableDataKeys.length > 0 && checkableDataKeys.every((item) => panelState.checked.includes(item));
  35. };
  36. const handleAllCheckedChange = (value) => {
  37. panelState.checked = value ? checkableData.value.map((item) => item[propsAlias.value.key]) : [];
  38. };
  39. watch(() => panelState.checked, (val, oldVal) => {
  40. updateAllChecked();
  41. if (panelState.checkChangeByUser) {
  42. const movedKeys = val.concat(oldVal).filter((v) => !val.includes(v) || !oldVal.includes(v));
  43. emit(CHECKED_CHANGE_EVENT, val, movedKeys);
  44. } else {
  45. emit(CHECKED_CHANGE_EVENT, val);
  46. panelState.checkChangeByUser = true;
  47. }
  48. });
  49. watch(checkableData, () => {
  50. updateAllChecked();
  51. });
  52. watch(() => props.data, () => {
  53. const checked = [];
  54. const filteredDataKeys = filteredData.value.map((item) => item[propsAlias.value.key]);
  55. panelState.checked.forEach((item) => {
  56. if (filteredDataKeys.includes(item)) {
  57. checked.push(item);
  58. }
  59. });
  60. panelState.checkChangeByUser = false;
  61. panelState.checked = checked;
  62. });
  63. watch(() => props.defaultChecked, (val, oldVal) => {
  64. if (oldVal && val.length === oldVal.length && val.every((item) => oldVal.includes(item)))
  65. return;
  66. const checked = [];
  67. const checkableDataKeys = checkableData.value.map((item) => item[propsAlias.value.key]);
  68. val.forEach((item) => {
  69. if (checkableDataKeys.includes(item)) {
  70. checked.push(item);
  71. }
  72. });
  73. panelState.checkChangeByUser = false;
  74. panelState.checked = checked;
  75. }, {
  76. immediate: true
  77. });
  78. return {
  79. filteredData,
  80. checkableData,
  81. checkedSummary,
  82. isIndeterminate,
  83. updateAllChecked,
  84. handleAllCheckedChange
  85. };
  86. };
  87. export { useCheck };
  88. //# sourceMappingURL=use-check.mjs.map