<template>
  <div id="">
    <a-layout>
      <a-layout-sider
        width="318px"
        style="border-right:2px solid #d5d5ff;float:left"
        :style="{ 'max-height': testHeight + 'px', height: testHeight + 'px' }"
      >
        <a-tree
          :tree-data="treeData"
          @select="handleCheckChange"
          :fieldNames="{ children: 'children', title: 'pnm', key: 'id' }"
          :auto-expand-parent="true"
          :expandedKeys.sync="expandedKeys"
          ref="PTTab_OrgTree"
          style="height:100%;"
        >
          <template #custom="{ item }"><div class="custom-tree-node">
            <span style="float:left;">{{ item.pnm }}</span>
            <div
              style="float:right;display: flex;justify-content: flex-end;align-items: center;width:50%;"
            >
              <span style="color:blue;width:80px;"></span>
            </div>
</template>
          </div>
</template>
        </a-tree>
      </a-layout-sider>
      <a-layout-content>
        <report_component :options="options" />
      </a-layout-content>
    </a-layout>
  </div>
</template>
<script>
import request from '../../utils/gw_ajax_request';
import report_componentContent from './report_componentContent.vue';

export default {
  components: { report_component: report_componentContent },
  data() {
    return {
      userid: localStorage.getItem('persId'),
      orgid: localStorage.getItem('currentOrgId'),
      testHeight: window.innerHeight - 130,
      treeData: [],
      expandedKeys: [],
      treeNodeArray: [],
      options: [
        {
          type: '001',
          value: 'tph001',
          label: '脱贫户基础信息',
          reportSrc: '/demo/reportJsp/reportJsp/showReport.jsp?rpx=tph001.rpx', // /modular-source/6ace62b8e2bb467d98286d260aebcef2
        },
        {
          type: '002',
          value: 'tph002',
          label: '问题清单',
          reportSrc: '/demo/reportJsp/reportJsp/showReport.jsp?rpx=tph002.rpx',
        },
      ],
    };
  },
  created() {
    this.getLeftTreeData();
    this.getPType();
  },
  methods: {
    getPType() {
      const params = {
        orgType: '111',
        batchName: '', // this.batchName,
        pnm: '', // this.batchGroupName,
      };
      request
        .post(
          '/bis/insp/BisInspProblemRelation/getProblemHandlingDropDownBox',
          params,
        )
        .then((res) => {
          if (res.success) {
            this.pTypeList = res.data;
          } else {
            this.$message.error(res.message);
          }
        });
    },
    getLeftTreeData() {
      this.expandedKeys = [];
      request
        .get('/dc/organization/base/getAllNode', {
          params: {
            userId: 'ff2d65f546b84447b7501523cc460df0', // this.userId,
            orgType: '111',
          },
        })
        .then((res) => {
          this.treeData = res.data;
          this.expandedKeys.push(res.data.id);
          if (res.data && res.data.children && res.data.children !== 0) {
            this.expandedKeys.push(
              res.data.children[res.data.children.length - 1].id,
            );
          }
        });
    },
    handleCheckChange(data, checked) {
      // this.prjType = undefined;
      this.treeNodeArray = data;
      // if (checked.node.dataRef.levels == "0") {
      //   this.batchGroupName = "";
      //   this.batchName = "";
      // } else if (checked.node.dataRef.levels == "1") {
      //   this.batchGroupName = "";
      //   this.batchName = checked.node.dataRef.pnm;
      // } else {
      //   this.batchGroupName = checked.node.dataRef.pnm;
      //   this.batchName = checked.node.dataRef.batchName;
      // }
      this.getPType();
    },
    getPType() {
      const params = {
        orgType: '111',
        batchName: '', // this.batchName,
        pnm: '', // this.batchGroupName,
      };
      request
        .post(
          '/bis/insp/BisInspProblemRelation/getProblemHandlingDropDownBox',
          params,
        )
        .then((res) => {
          if (res.success) {
            this.pTypeList = res.data;
          } else {
            this.$message.error(res.message);
          }
        });
    },
  },
};
</script>
<style lang='less' scoped>
</style>
