<template>
  <div class="wrap">
    <!-- v-on:wheel="zoomSize" :style="'transform: scale(' + nowVal / 100 + ');'" -->
    <div class="content">
      <div v-for="(item, index) in levelArr" :key="item" :class="[`flowLevel-${index + 1}`]">
        <div>{{ getTitleNameMapFun(item) }}</div>
      </div>
      <el-row>
        <el-col :span="4">
          <div class="contentList"></div>
        </el-col>
        <el-col :span="20">
          <div class="dingflow-design" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 21, 64, 0.3)">
            <nodeWrap :nodeConfig.sync="nodeConfig"></nodeWrap>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: "JwTree",
  data() {
    return {
      loading: false,
      levelArr: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
      navList: [
        {
          name: "党委组织架构",
          key: "1",
          ifActive: true,
        },
        {
          name: "居委组织架构",
          key: "2",
          ifActive: false,
        },
        {
          name: "网格架构",
          key: "3",
          ifActive: false,
        },
      ],
      cardList: [
        {
          title: "社区党委",
          key: "1",
          name: "南昌路社区党委 （党委书记：解书记）",
          children: [
            {
              title: "网格党支部",
              name: "第一网格党支部(支部书记：王艺发)",
              key: "1",
              children: [
                {
                  title: "楼院党小组",
                  name: "第一楼院党小组 （组长：韩文国）",
                  key: "1",
                },
                {
                  title: "楼院党小组",
                  name: "第二楼院党小组 （组长：褚丽兰）",
                  key: "2",
                },
              ],
            },
            {
              title: "网格党支部",
              name: "第二网格党支部 （支部书记：尤芬紫）",
              key: "2",
              children: [
                {
                  title: "楼院党小组",
                  name: "第一楼院党小组 （组长：韩文国）",
                  key: "1",
                },
                {
                  title: "楼院党小组",
                  name: "第二楼院党小组 （组长：褚丽兰）",
                  key: "2",
                },
              ],
            },
            {
              title: "网格党支部",
              name: "第三网格党支部 （支部书记：凤桥强）",
              key: "3",
              children: [
                {
                  title: "楼院党小组",
                  name: "第一楼院党小组 （组长：韩文国）",
                  key: "1",
                },
                {
                  title: "楼院党小组",
                  name: "第二楼院党小组 （组长：褚丽兰）",
                  key: "2",
                },
                {
                  title: "楼院党小组",
                  name: "第三楼院党小组 （组长：王丽丽）",
                  key: "3",
                },
              ],
            },
          ],
        },
      ],
      nowVal: 100,

      nodeConfig: {
        partyOrgName: "市北区委",
        partyOrgLevel: 1,
        partyOrgPid: "0",
        principalName: "栾秀杰",
        laneLevel: 1,
        children: [
          {
            partyOrgName: "市北区委",
            partyOrgLevel: 2,
            partyOrgPid: "0",
            principalName: "栾秀杰",
            laneLevel: 2,
            children: [
              {
                partyOrgName: "市北区委",
                partyOrgLevel: 3,
                partyOrgPid: "0",
                principalName: "栾秀杰",
                laneLevel: 3,
                children: [
                  {
                    partyOrgName: "市北区委",
                    partyOrgLevel: 4,
                    partyOrgPid: "0",
                    principalName: "栾秀杰",
                    laneLevel: 4,
                    children: [
                      // {
                      //   partyOrgName: "市北区委",
                      //   partyOrgLevel: 5,
                      //   partyOrgPid: "0",
                      //   principalName: "栾秀杰",
                      //   laneLevel: 5,
                      //   children: [
                      //     {
                      //       partyOrgName: "市北区委",
                      //       partyOrgLevel: 6,
                      //       partyOrgPid: "0",
                      //       principalName: "栾秀杰",
                      //       laneLevel: 6,
                      //       children: [
                      //         {
                      //           partyOrgName: "市北区委",
                      //           partyOrgLevel: 7,
                      //           partyOrgPid: "0",
                      //           principalName: "栾秀杰",
                      //           laneLevel: 7,
                      //           children: [
                      //             {
                      //               partyOrgName: "市北区委",
                      //               partyOrgLevel: 8,
                      //               partyOrgPid: "0",
                      //               principalName: "栾秀杰",
                      //               laneLevel: 8,
                      //               children: [
                      //                 {
                      //                   partyOrgName: "市北区委",
                      //                   partyOrgLevel: 9,
                      //                   partyOrgPid: "0",
                      //                   principalName: "栾秀杰",
                      //                   laneLevel: 9,
                      //                   children: [
                      //                     {
                      //                       partyOrgName: "市北区委",
                      //                       partyOrgLevel: 10,
                      //                       partyOrgPid: "0",
                      //                       principalName: "栾秀杰",
                      //                       laneLevel: 10,
                      //                     },
                      //                   ],
                      //                 },
                      //               ],
                      //             },
                      //           ],
                      //         },
                      //       ],
                      //     },
                      //   ],
                      // },
                    ],
                  },
                ],
              },
            ],
          },
        ],

        // title: "社区党委",
        // name: "南昌路社区党委(党委书记：解书记)",
        // key: "1",
        // children: [
        //   {
        //     title: "网格党支部",
        //     name: "第一网格党支部 （支部书记：王艺发）",
        //     type: 2,
        //     children: [
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第一楼院党小组 （组长：韩文国）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "杨军",
        //           },
        //         ],
        //       },
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第二楼院党小组 （组长：褚丽兰）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "杨军",
        //           },
        //         ],
        //       },
        //     ],
        //   },
        //   {
        //     title: "网格党支部",
        //     name: "第二网格党支部 （支部书记：尤芬紫）",
        //     type: 3,
        //     children: [
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第一楼院党小组 （组长：韩文国）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //             children: [
        //               {
        //                 title: "联系家庭",
        //                 type: 5,
        //                 name: "王宇",
        //               },
        //               {
        //                 title: "联系家庭",
        //                 type: 5,
        //                 name: "刘冰冰",
        //               },
        //               {
        //                 title: "联系家庭",
        //                 type: 5,
        //                 name: "杨飞宇",
        //               },
        //               {
        //                 title: "联系家庭",
        //                 type: 5,
        //                 name: "齐天",
        //               },
        //             ],
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //         ],
        //       },
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第二楼院党小组 （组长：褚丽兰）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //         ],
        //       },
        //     ],
        //   },
        //   {
        //     title: "网格党支部",
        //     name: "第三网格党支部 （支部书记：凤桥强）",
        //     type: 3,
        //     children: [
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第一楼院党小组 （组长：韩文国）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "杨军",
        //           },
        //         ],
        //       },
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第二楼院党小组 （组长：褚丽兰）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "杨军",
        //           },
        //         ],
        //       },
        //       {
        //         title: "楼院党小组",
        //         type: 3,
        //         name: "第三楼院党小组 （组长：王丽丽）",
        //         children: [
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "周游",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "王阳明",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "刘艳萍",
        //           },
        //           {
        //             title: "党员中心户",
        //             type: 4,
        //             name: "谢苗苗",
        //           },
        //         ],
        //       },
        //     ],
        //   },
        // ],
      },
    };
  },
  computed: {},
  mounted() {
    // this.getTreeData();
  },
  methods: {
    //获取背景层级
    getDataPLevel(item) {
      let arr = [...this.levelArr];
      arr.push(item.partyOrgLevel);
      this.levelArr = [...arr];
      if (item.children) {
        this.getDataPLevel(item.children[0]);
      }
    },
    //获取树状结构
    getTreeData() {
      this.loading = true;
      this.$http
        .get("/actual/base/organizational/structure/partyCommitteeOrg")
        .then((res) => {
          const {
            data: { code, data },
          } = res;
          if (code === 0) {
            this.nodeConfig = data[0];
            this.getDataPLevel(data[0]);
            this.loading = false;
          }
        })
        .catch(() => {
          this.loading = false;
        });
    },

    getTitleNameMapFun(i) {
      let titleNameMap = new Map([
        [1, "省委"],
        [2, "市委"],
        [3, "区委"],
        [4, "党工委"],
        [5, "党委"],
        [6, "党总支"],
        [7, "党支部"],
        [8, "楼院党小组"],
        [9, "党员中心户"],
        [10, "联系家庭"],
      ]);
      return titleNameMap.get(i);
    },

    zoomSize(e) {
      e.preventDefault();
      if (e.deltaY > 0) {
        if (this.nowVal == 50) return;
        this.nowVal -= 0.5;
      } else if (e.deltaY < 0) {
        if (this.nowVal == 300) return;
        this.nowVal += 0.5;
      }
    },
  },
};
</script>

<style lang="scss">
@import "~@/assets/css/workflow.scss";
</style>
