comp-dept-list.vue 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <avue-crud v-bind="bindVal" v-on="onEvent" v-model="form"> </avue-crud>
  3. </template>
  4. <script>
  5. export default window.$crudCommon(
  6. {
  7. props: {
  8. yearAndMonth: [String, Number],
  9. },
  10. watch: {
  11. yearAndMonth() {
  12. this.loadData();
  13. },
  14. },
  15. methods: {
  16. buildTree(flatList, options = {}) {
  17. const {
  18. idKey = 'id', // 节点ID的键名
  19. parentKey = 'parentId', // 父节点ID的键名
  20. childrenKey = 'children' // 子节点列表的键名
  21. } = options;
  22. const nodeMap = {}; // 用于快速查找节点的映射表
  23. const tree = []; // 最终生成的树
  24. // 第一次遍历:创建所有节点的映射
  25. flatList.forEach(node => {
  26. nodeMap[node[idKey]] = {
  27. ...node,
  28. [childrenKey]: []
  29. };
  30. });
  31. // 第二次遍历:构建父子关系
  32. flatList.forEach(node => {
  33. const parentId = node[parentKey];
  34. if (parentId !== null && parentId !== undefined && nodeMap[parentId]) {
  35. // 如果有父节点,则将当前节点添加到父节点的children中
  36. nodeMap[parentId][childrenKey].push(nodeMap[node[idKey]]);
  37. } else {
  38. // 如果没有父节点或父节点不存在,则作为根节点
  39. tree.push(nodeMap[node[idKey]]);
  40. }
  41. });
  42. return tree;
  43. },
  44. loadData() {
  45. this.loading = true;
  46. this.api[this.option.list || "getList"](
  47. { yearAndMonth: this.yearAndMonth }
  48. ).then(({ data }) => {
  49. console.log(this.buildTree(data.data))
  50. this.data = this.buildTree(data.data);
  51. this.loading = false;
  52. });
  53. },
  54. // getSearchParams() {
  55. // return { yearAndMonth: this.yearAndMonth };
  56. // },
  57. },
  58. },
  59. {
  60. // 模块路径
  61. name: "basicResource/compDeptList",
  62. }
  63. );
  64. </script>