djbFrameall.vue 5.49 KB
<!--
 * @Description:
 * @Autor: renchao
 * @LastEditTime: 2023-07-19 09:52:59
-->
<template>
  <div class="content loadingtext">
    <div class="left">
      <el-tree
        ref="tree"
        :data="treedata"
        :props="defaultProps"
        @node-click="handleNodeClick"
        :default-expand-all="true"
        :expand-on-click-node="false"
        node-key="id"
        :default-checked-keys="[showTab]"
      >
      </el-tree>
    </div>
    <div class="right">
      <component :is="componentTag" v-bind="currentSelectProps" />
    </div>
  </div>
</template>
<script>
import { getBdcqljqtsx } from "@/api/djbDetail.js";
import { loadTreeData, getNode } from "./djbFrameData.js";
// import { searchTaskToDo } from "@/api/workflow/search.js";
import { getDjbBysearch } from "@/api/search.js";
import {
  leftMenu
} from "@/api/workFlow.js";
export default {
  data () {
    return {
      //选择加载哪一个组件
      componentTag: "",
      //子组件接收参数
      currentSelectProps: {},
      //左侧树形结构数据
      treedata: [],
      // 查询参数
      queryForm: {},

      defaultNode: "",
      defaultProps: {
        value: "id",
        children: "children",
        label: "label",
      },
      showTab: "bdcqldjml", // 选中状态,根据表格中权利类型判断
         bdcdyid:"",
        bdcdyh: "",
        qllx: "",
        bsmQlxx: "",
    };
  },
  mounted () {
    this.getdata()

  },
  methods: {
    // 截取字符的方法
    /**
     * @description: 截取字符的方法
     * @param {*} obj
     * @author: renchao
     */
    getCaption (obj) {
      let index = obj.lastIndexOf("=");
      obj = obj.substring(index + 1, obj.length);
      return obj
    },
    // 通过不动产业务号获取参数
    /**
     * @description: 通过不动产业务号获取参数
     * @author: renchao
     */
    getdata () {
      this.queryForm = {
        bdcdyh: this.getCaption(window.location.href)

      }
      if (this.getCaption(window.location.href)) {
         this.$startLoading();
        getDjbBysearch({
          ...this.queryForm,
        }).then((res) => {
          if (res.code === 200) {
           this.$endLoading();
            let { records } = res.result;
            if(records.length){
              console.log("true",records.length);
                this.bdcdyid=records[0].bdcdyid
                this.bdcdyh=records[0].bdcdyh
                this.qllx=records[0].qllx
                this.bsmQlxx=records[0].bsmQlxx
                this.loadData()
            }else{
              console.log("false",records.length);
               this.treedata=[]
            }

          }
        });
      }else{
         this.treedata=[]
      }

    },

    // 获取不动产信息
    /**
     * @description: 获取不动产信息
     * @param {*} a
     * @param {*} b
     * @author: renchao
     */
    // loadBdcdylist (a, b) {
    //   var formdata = new FormData();
    //   formdata.append("bsmSlsq", a);
    //   formdata.append("bestepid", b);
    //   leftMenu(formdata).then((res) => {
    //     if (res.code === 200) {
    //       if (res.result) {
    //         this.currentSelectProps = res.result[0];
    //         this.loadData();
    //       }
    //     }
    //   });
    // },
    /**
     * @description: loadData
     * @author: renchao
     */
    loadData () {
      getBdcqljqtsx({
        bdcdyid: this.bdcdyid,
        bdcdyh: this.bdcdyh,
      }).then((res) => {
        if (res.code === 200) {
          this.treedata = loadTreeData(res.result, this.bdcdyh);
          this.$nextTick(function () {
            this.defaultNode = getNode(this.qllx, { linShi: 0, xianShi: 0, liShi: 0 }, "");
            this.$refs.tree.setCurrentKey(this.defaultNode.id); //data[0].id为默认选中的节点
            this.loadComponent(this.defaultNode.form);
          });
        }
      });
      this.currentSelectProps = {
        bdcdyid: this.bdcdyid,
        bdcdyh: this.bdcdyh,
        qllx: this.qllx,
        bsmQlxx: this.bsmQlxx,
      };
    },
    /*
      点击登记簿菜单
     */
    /**
     * @description: 点击登记簿菜单
     * @param {*} data
     * @param {*} node
     * @param {*} elem
     * @author: renchao
     */
    handleNodeClick (data, node, elem) {
      this.loadComponent(data.form);
    },
    /**
     * @description: loadComponent
     * @param {*} form
     * @author: renchao
     */
    loadComponent (form) {
      this.componentTag = (r) =>
        require.ensure([], () => r(require("@/views/registerBook/" + form)));
    },
  },
};
</script>
<style scoped lang="scss">
/deep/.rollTable {
  height: calc(120vh - 254px) !important;
}

.content {
  width: 100%;
  height: 100%;
  display: flex;

  .left {
    width: 256px;
    height: 100%;
    background-color: #f5f5f5;
    color: #333;
    border: 1px solid rgb(228, 228, 228);
  }

  .right {
    width: calc(100% - 256px);
    height: 100%;
    // overflow-y: scroll;
    overflow: auto;
    background-color: #f5f5f5;
    border: 1px solid rgb(228, 228, 228);
  }
}

/deep/ .expanded.el-tree-node__expand-icon,
/deep/ .el-tree-node__expand-icon {
  visibility: hidden;
}

/deep/ .el-tree-node__content {
  border: 1px solid rgb(228, 228, 228);
  height: 45px;
}

/deep/ .el-tree-node:focus > .el-tree-node__content {
  background-color: #f5f5f5;
  color: #0079fe;
  border-right: 4px solid #0079fe;
}

/deep/.el-tree-node {
  white-space: pre-wrap;
}

/deep/ .is-current > .el-tree-node__content {
  background-color: #f5f5f5;
  color: #0079fe;
  border-right: 4px solid #0079fe;
}
</style>