<!--
 * @Description:
 * @Autor: renchao
 * @LastEditTime: 2023-05-24 15:31:00
-->
<template>
  <div class="container">
    <!-- 顶部内容框 -->
    <div class="topButton">
      <!-- 左侧业务功能按钮 -->
      <ul>
        <li
          @click="operation(item)"
          v-for="(item, index) in leftButtonList"
          :key="index"
        >
          <svg-icon class="icon" :icon-class="item.icon" />
          <span class="iconName">{{ item.name }}</span>
        </li>
      </ul>
      <ul>
        <li
          @click="operation(item)"
          v-for="(item, index) in rightButtonList"
          :key="index"
        >
          <svg-icon class="icon" :icon-class="item.icon" />
          <span class="iconName">{{ item.name }}</span>
        </li>
      </ul>
      <!-- <NoticeBar
        class="NoticeBar"
        :noticeList="noticeList"
        v-if="noticeList.length > 0"
      /> -->
    </div>
    <!-- 内容框架 -->
    <div class="containerFrame">
      <!-- 左侧菜单栏 区分业务-->
      <ordinaryMenu ref="Menu" @getCurrentSelectProps="getCurrentSelectProps" />
      <div class="leftCon">
        <!-- 分屏左侧预览 -->
        <div v-if="splitScreen" class="splitScreen-con">
          <component :is="clxxForm" v-bind="currentSelectProps" :key="fresh" />
        </div>
        <!-- 表单内容区域 -->
        <div class="rightContainer">
          <el-tabs v-model="tabName" :before-leave="beforeLeave">
            <el-tab-pane
              :label="item.name"
              :name="item.value"
              v-for="item in tabList"
              :key="item.value"
            >
            </el-tab-pane>
          </el-tabs>
          <component
            :key="fresh"
            :is="componentTag"
            v-bind="currentSelectProps"
          />
        </div>
      </div>
    </div>
  </div>
</template>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "./workFrame.scss";
</style>
<script>
import WorkFlow from "./mixin/index";
import { getForm } from "./flowform"
import NoticeBar from "@/components/NoticeBar/index";
import { unClaimTask } from "@/api/ywbl.js";
import ProcessViewer from "./components/processViewer.vue";
// 引入左侧菜单
import ordinaryMenu from "./components/leftmenu/ordinaryMenu.vue";
import selectBdc from "@/views/ywbl/ywsq/selectBdc.vue";
import { loadTreeData, getNode } from "./components/leftmenu/djbFrameData.js";
// 登记簿数据信息
import { addRepairRecord } from "@/api/djbbl.js"
// 获取权利类型数组
import { getQllxByBdcdyid } from "@/api/djbbl.js"

import { getBdcqljqtsx } from "@/api/registerBook.js";
export default {
  components: {
    selectBdc,
    NoticeBar,
    ProcessViewer,
    ordinaryMenu,
  },
  mixins: [WorkFlow],
  data() {
    return {
      bsmSlsq: this.$route.query.bsmSlsq,
      //当前流程所在环节
      bestepid: this.$route.query.bestepid,
      //受理申请标识码
      bdcdyid: this.$route.query.bdcdyid,
      //当前流程所在环节
      bdcdyh: this.$route.query.bdcdyh,
      qllx: this.$route.query.qllx,
      //设置那个表单选中
      tabName: "",
      // 权利类型数组
      qllxlist:[],
      //表单集合
      tabList: [],
      //选择加载哪一个组件
      componentTag: "",
      //设置表单传递数据
      currentSelectProps: {},
      //材料信息选择卡索引
      clxxIndex: "",
      //材料信息选项卡对象
      clxxTab: {},
      //页面监听时间
      _beforeUnload_time: "",
      treedata:{},
      tabdata:[],
      defaultNode:{}
    };
  },
  mounted() {

  },

  methods: {
    getQllxByBdcdyid(){
    getQllxByBdcdyid(this.currentSelectProps.bdcdyid).then((res) => {
        if (res.code === 200) {
          console.log("Qllxlist",res);

        }
      });
    },
    // 获取右侧选项卡
      getCurrentSelectProps (val) {
        this.currentSelectProps = val
        if(this.currentSelectProps.bsmRepair){
           this.tabset(val)
        }else{
            this.getdjblist()
        }

      },
      // 获取渲染登记簿列表
    getdjblist(){
     getBdcqljqtsx({
        bdcdyid: this.currentSelectProps.bdcdyid,
        bdcdyh: this.currentSelectProps.bdcdyh,
      }).then((res) => {
        if (res.code === 200) {
          this.treedata = loadTreeData(res.result, this.bdcdyh);
          this.$nextTick(function () {
            console.log("this.currentSelectProps.qllx",this.currentSelectProps);
            this.defaultNode = getNode(this.currentSelectProps.qllx, { linShi: 0, xianShi: 0, liShi: 0 }, "");
            console.log("this.defaultNode",this.defaultNode);
             this.tabName =this.defaultNode.id; //data[0].id为默认选中的节点
          });
        }
      });

   setTimeout(() => {
     let settree=JSON.parse(JSON.stringify(this.treedata))
     this.tabdata=[...settree,...settree[1].children[0].children[0].children]
     this.tabdata.forEach((item,index,arr) => {
       arr[index].name=item.label;
       arr[index].value=item.id
     })
     this.tabList=this.tabdata
      this.getQllxByBdcdyid()
   }, 200)

    },

    tabset(val){
      this.tabName = '';
     this.tabList = [
          {
            name:val.qllxmc+ "补录信息",
            value: "slxx",
            sort: 1,
          },
           {
            name: "审批意见",
            value: "spyj",
            sort: 2,
          },
          {
            name: "材料信息",
            value: "clxx",
            sort: 2,
          },
        ];

          this.$nextTick(function () {
            this.tabName = 'slxx';
          });

        },

     //右侧表单选项卡事件
    beforeLeave (activeName, oldActiveName) {
      if (activeName && activeName != 0) this.getFromRouter(activeName)
    },
    //切换选项卡内容组件
    getFromRouter (tabname) {
         for (let item of this.tabList) {
        if (item.value === tabname) {
          this.currentSelectTab = item
          break;
        }
      }
      this.componentTag = getForm(tabname, this.$route.query.sqywbm);
    },

    // 增加补录记录
      addRepairRecord(row){
        console.log("this.currentSelectProps",this.currentSelectProps);
         let from={
           bsmQlxx:"",
           bsmSlsq:this.bsmSlsq,
           bsmSldy:this.currentSelectProps.bsmSldy,
           operate:"C",
           qllx:this.currentSelectProps.qllx
        }
        if(row){
          from.bsmQlxx=row.bsmQlxx
          from.operate="U"
          from.qllx=row.qllx
        }

         addRepairRecord(from).then((res) => {
        this.$nextTick(() => {
              this.$refs.Menu.getleftMenubl(res.result);
            });
      });
      },
  },
};
</script>