<template>
  <div class="feed-summary-container">
    <div class="feed-summary-inner">
      <div class="left-side-menu">
        <project-side-menu :menuTree="menuTreeList" :menuOptions="menuOptions" :unique-opened="false" :default-active="defaultActive">
          <template slot="房建类成本科目-1">
            <img src="@/assets/images/projectCostLedger/icon_cost_detail_2.svg" alt="">
            <div class="project-sub-menu-title-text">房建类成本科目</div>
          </template>
          <template slot="未归类项目-1">
            <img src="@/assets/images/projectCostLedger/icon_cost_detail_3.svg" alt="">
            <div class="project-sub-menu-title-text">未归类项目</div>
          </template>
        </project-side-menu>
      </div>
    </div>
  </div>
</template>
<script>
import ProjectSideMenu from "@/views/projectCostLedger/detail/components/ProjectSideMenu";
import { getFeedSummaryMenuTreeApi } from "@/api/projectCostLedger";
export default {
  name: "feedSummary",
  props: {
    // 项目ID
    projectId: {
      type: String,
      required: true,
      default: ""
    },
    // 详情信息
    projectDetailInfo: {
      type: Object,
      default: () => ({})
    }
  },
  watch: {
    projectDetailInfo: {
      handler(newValue) {
        this.comProjectDetailInfo = newValue ? newValue : {};
        this.init(this.comProjectDetailInfo);
      },
      deep: true,
      immediate: true
    },
    projectId: {
      handler(newValue) {
        this.comProjectId = newValue;
      },
      immediate: true
    }
  },
  components: {
    ProjectSideMenu
  },
  data() {
    return {
      menuOptions: {
        nodeName: "name",
        nodeValue: "name",
      },
      comProjectDetailInfo: {},
      comProjectId: "",
      defaultActive: "",
      menuTreeList: [
        // {
        //   nodeName: "房建类成本科目",
        //   id: "1",
        //   children: [
        //     {
        //       nodeName: "劳务分包工程",
        //       id: "1-1",
        //       children: [
        //         {
        //           nodeName: "主体工程-结构劳务",
        //           id: "1-1-1",
        //           children: [
        //             {
        //               nodeName: "结构劳务分包",
        //               id: "1-1-1-1",
        //             }
        //           ]
        //         },
        //         {
        //           nodeName: "二次结构及粗装修劳务",
        //           id: "1-2-1",
        //           children: [
        //             {
        //               nodeName: "二次机构及粗装修劳务",
        //               id: "1-2-1",
        //             }
        //           ]
        //         },
        //         {
        //           nodeName: "拆除、修缮、清理、改造劳...",
        //           id: "1-3-1",
        //           children: [
        //             {
        //               nodeName: "拆除、修缮、清理、改造劳...",
        //               id: "1-3-1",
        //             }
        //           ]
        //         }
        //       ]
        //     },
        //     {
        //       nodeName: "专业分包工程",
        //       id: "2-1",
        //     },
        //     {
        //       nodeName: "实体工程材料（土建）",
        //       id: "3-1",
        //     },
        //     {
        //       nodeName: "其他直接费成本",
        //       id: "4-1",
        //     },
        //   ]
        // },
        // {
        //   nodeName: "未归类项目",
        //   id: "2",
        //   children: []
        // }
      ]
    };
  },
  //可访问data属性
  created() {

  },
  //计算集
  computed: {

  },
  //方法集
  methods: {
    async init(detail = {}) {
      try {
        const { projectId, cbStage } = detail;
        if (!projectId) return;
        await this.getFeedSummaryMenuTree({
          projectId,
          cbStage
        });
      } catch (error) {

      }
    },
    async getFeedSummaryMenuTree(params) {
      try {
        const result = await getFeedSummaryMenuTreeApi(params);
        if (result.code == 200) {
          const _tempArray = result.data;
          this.menuTreeList = _tempArray;
        }
      } catch (error) {

      }
    }
  },
}
</script>
<style lang="scss" scoped>
.feed-summary-container {
  width: 100%;
  height: 100%;

  .feed-summary-inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;

    .left-side-menu {
      width: 220px;
      min-width: 220px;
      height: 100%;
    }
  }
}
</style>
