ivue-material-plus
Version:
A high quality UI components Library with Vue.js
216 lines (213 loc) • 6.69 kB
JavaScript
import { getCurrentInstance, ref, computed, unref, watch } from 'vue';
import { getRowIdentity, walkTreeNode } from '../utils.mjs';
import { throwError } from '../../../utils/error.mjs';
function useTree(watcherData) {
const vm = getCurrentInstance();
const indent = ref(16);
const lazy = ref(false);
const treeData = ref({});
const lazyColumnIdentifier = ref("hasChildren");
const childrenColumnName = ref("children");
const lazyTreeNodeMap = ref({});
const expandRowKeys = ref([]);
const normalizedData = computed(() => {
if (!watcherData.rowKey.value) {
return {};
}
const data = watcherData.data.value || [];
return normalize(data);
});
const normalizedLazyNode = computed(() => {
const rowKey = watcherData.rowKey.value;
const keys = Object.keys(lazyTreeNodeMap.value);
const res = {};
if (!keys.length) {
return res;
}
keys.forEach((key) => {
if (lazyTreeNodeMap.value[key].length) {
const item = {
children: []
};
lazyTreeNodeMap.value[key].forEach((row) => {
const currentRowKey = getRowIdentity(row, rowKey);
item.children.push(currentRowKey);
if (row[lazyColumnIdentifier.value] && !res[currentRowKey]) {
res[currentRowKey] = {
children: []
};
}
});
res[key] = item;
}
});
return res;
});
const normalize = (data) => {
const rowKey = watcherData.rowKey.value;
const res = {};
walkTreeNode(
data,
(parent, children, level) => {
const rowKeyData = getRowIdentity(parent, rowKey);
if (Array.isArray(children)) {
res[rowKeyData] = {
children: children.map((row) => getRowIdentity(row, rowKey)),
level
};
} else {
res[rowKeyData] = {
children: [],
lazy: true,
level
};
}
},
childrenColumnName.value,
lazyColumnIdentifier.value
);
return res;
};
const loadOrToggle = (row) => {
vm.store.assertRowKey();
const rowKey = watcherData.rowKey.value;
const id = getRowIdentity(row, rowKey);
const data = treeData.value[id];
if (lazy.value && data && "loaded" in data && !data.loaded) {
loadData(row, id, data);
} else {
toggleTreeExpansion(row, void 0);
}
};
const loadData = (row, key, treeNode) => {
const { load } = vm.props;
if (load && !treeData.value[key].loaded) {
treeData.value[key].loading = true;
load(row, treeNode, (data) => {
if (!Array.isArray(data)) {
throw new TypeError("[Table] data must be an array");
}
treeData.value[key].loading = false;
treeData.value[key].loaded = true;
treeData.value[key].expanded = true;
if (data.length) {
lazyTreeNodeMap.value[key] = data;
}
vm.emit("on-expand-change", row, true);
});
}
};
const updateTreeData = (ifChangeExpandRowKeys = false, ifExpandAll = ((_a) => (_a = vm.store) == null ? void 0 : _a.states.defaultExpandAll.value)()) => {
var _a2;
const nested = normalizedData.value;
const normalizedLazyNode_ = normalizedLazyNode.value;
const keys = Object.keys(nested);
const newTreeData = {};
if (keys.length) {
const oldTreeData = unref(treeData);
const rootLazyRowKeys = [];
const getExpanded = (oldValue, key) => {
if (ifChangeExpandRowKeys) {
if (expandRowKeys.value) {
return ifExpandAll || expandRowKeys.value.includes(key);
} else {
return !!(ifExpandAll || (oldValue == null ? void 0 : oldValue.expanded));
}
} else {
const included = ifExpandAll || expandRowKeys.value && expandRowKeys.value.includes(key);
return !!((oldValue == null ? void 0 : oldValue.expanded) || included);
}
};
keys.forEach((key) => {
const oldValue = oldTreeData[key];
const newValue = { ...nested[key] };
newValue.expanded = getExpanded(oldValue, key);
if (newValue.lazy) {
const { loaded = false, loading = false } = oldValue || {};
newValue.loaded = !!loaded;
newValue.loading = !!loading;
rootLazyRowKeys.push(key);
}
newTreeData[key] = newValue;
});
const lazyKeys = Object.keys(normalizedLazyNode_);
if (lazy.value && lazyKeys.length && rootLazyRowKeys.length) {
lazyKeys.forEach((key) => {
const oldValue = oldTreeData[key];
const lazyNodeChildren = normalizedLazyNode_[key].children;
if (rootLazyRowKeys.includes(key)) {
if (newTreeData[key].children.length !== 0) {
throwError("ivue-table", "children must be an empty array");
}
newTreeData[key].children = lazyNodeChildren;
} else {
const { loaded = false, loading = false } = oldValue || {};
newTreeData[key] = {
lazy: true,
loaded: !!loaded,
loading: !!loading,
expanded: getExpanded(oldValue, key),
children: lazyNodeChildren,
level: ""
};
}
});
}
}
treeData.value = newTreeData;
(_a2 = vm.store) == null ? void 0 : _a2.updateTableScrollY();
};
const toggleTreeExpansion = (row, expanded) => {
vm.store.assertRowKey();
const rowKey = watcherData.rowKey.value;
const id = getRowIdentity(row, rowKey);
const data = id && treeData.value[id];
if (id && data && "expanded" in data) {
const oldExpanded = data.expanded;
expanded = typeof expanded === "undefined" ? !data.expanded : expanded;
treeData.value[id].expanded = expanded;
if (oldExpanded !== expanded) {
vm.emit("on-expand-change", row, expanded);
}
vm.store.updateTableScrollY();
}
};
const updateTreeExpandKeys = (value) => {
expandRowKeys.value = value;
updateTreeData();
};
watch(
() => normalizedData.value,
() => {
updateTreeData();
}
);
watch(
() => expandRowKeys.value,
() => {
updateTreeData(true);
}
);
watch(
() => normalizedLazyNode.value,
() => {
updateTreeData();
}
);
return {
loadOrToggle,
updateTreeData,
updateTreeExpandKeys,
toggleTreeExpansion,
states: {
indent,
lazy,
treeData,
lazyColumnIdentifier,
childrenColumnName,
lazyTreeNodeMap
}
};
}
export { useTree as default };
//# sourceMappingURL=tree.mjs.map