client-base-v5/src/widget/ProjectItemTree.vue

<template>
  <div>
    <TreeViewNode
      v-for="data in projectItems"
      :key="data.id"
      :node="data"
      :is-root="true"
      :is-show-check="true"
      @node-select="projectItemSelect"
    />
  </div>
</template>


<script>

import Common from "../base/common/Common.js";
import ProjectItemResource from '../api/commom/ProjectItemResource.js';
import TreeViewNode from '../base/widget/TreeViewNode.vue';
import { Notify, Uuid } from 'pc-component-v3';

export default {
  /**
     * ids: 选中的数据
     */
  props: ['ids'],
  data: function () {
    return {
      projectItems: [],    //所有资产分类的大类
    };
  },

  components: {
    TreeViewNode,
  },

  methods: {
    /**
         * 查询可访问的分类
         */
    queryProjectItems: function () {
      var _self = this;
      ProjectItemResource.listRootSubProjectItems().then(successData => {
        if(successData.errorCode == 0) {
          _self.initProjectItem(successData.datas);
          _self.setSelectedIds(_self.ids);
        } else {
          Notify.error('提示', successData.errorMessage, false);
        }
      }, errorData => {
        Common.processException(errorData);
      });
    },

    /**
         * 初始化资产类别
         */
    initProjectItem: function (data) {
      var _self = this;
      function setOpen(node) {
        node.open = false;
        node.selected = false;
        node.isShowCheck = true;
        node.name = node.text;
        node.childrenDatas = node.children;
        if (node.childrenDatas != undefined && node.childrenDatas.length > 0) {
          node.childrenDatas.forEach(function (item) {
            setOpen(item);
          });
        }
      }
      if (data) {
        data.forEach(function (item) {
          setOpen(item);
        });
      }
      _self.projectItems = data;
    },

    /**
        * 父组件调用，用来初始化数据
        */
    initProjectItem1: function () {
      var _self = this;
      _self.initProjectItem(_self.projectItems);
    },

    /**
         * 类别选择发生改变
         */
    projectItemSelect: function (node) {
      var _self = this;
      node.selected = !node.selected;
      var current = node.selected;

      function changeSelect(item) {
        item.selected = current;
        if (item.childrenDatas != undefined && item.childrenDatas.length > 0) {
          item.childrenDatas.forEach(function (item1) {
            changeSelect(item1);
          });
        }
      }

      changeSelect(node);
      // 触发selectChanged事件
      _self.$emit('selectChanged');

      let selectedIds = this.getSelectedIds();

      _self.$emit('valueChanged', selectedIds);
    },

    /**
         * 设置选中项
         */
    setSelectedIds: function (ids) {
      var _self = this;
      function setSelected(item) {
        if (ids != null && ids.indexOf(item.id) >= 0) {
          item.selected = true;
        } else {
          item.selected = false;
        }

        if (item.childrenDatas != undefined && item.childrenDatas.length > 0) {
          item.childrenDatas.forEach(function (item1) {
            setSelected(item1);
          });
        }
      }

      _self.projectItems.forEach(function (item) {
        setSelected(item);
      });

      function setParentSelect(item) {
        if (item.childrenDatas != undefined && item.childrenDatas.length > 0) {
          var selectedCount = 0;
          item.childrenDatas.forEach(function (item1) {
            setParentSelect(item1);
            if (ids != null && ids.indexOf(item1.id) >= 0) {
              selectedCount++;
            }
          });
          if (selectedCount > 0) {
            if (selectedCount < item.childrenDatas.length) {
              item.open = true;
              item.selected = false;
            } else {
              item.selected = true;
            }
          }
        }
      }
      _self.projectItems.forEach(function (item) {
        setParentSelect(item);
      });
    },

    /**
         * 获取选择的类别id
         */
    getSelectedIds: function () {
      var _self = this;
      var arr = [];
      function getSelected(item) {
        if (item.selected) {
          arr.push(item.id);
        }
        if (item.childrenDatas != undefined && item.childrenDatas.length > 0) {
          item.childrenDatas.forEach(function (item1) {
            getSelected(item1);
          });
        }
      }
      _self.projectItems.forEach(function (item) {
        getSelected(item);
      });
      return arr;
    },
  },

  mounted: function () {
    this.queryProjectItems();


    if (this.ids != null) {
      this.setSelectedIds(this.ids);
    }
  },

  watch: {
    'ids': function (currentValue, oldValue) {
      if (currentValue) {
        this.setSelectedIds(currentValue);
      }
    },
  },
};
</script>

<style scoped>
</style>