yfiling.vue 3.69 KB
<template>
  <div class="app-container">

    <el-row :gutter="20">
      <!--部门数据-->
      <el-col :span="4" :xs="24">



        <div class="head-container">
          <el-input
            v-model="deptName"
            placeholder="请输入部门名称"
            clearable
            size="small"
            prefix-icon="el-icon-search"
            style="margin-bottom: 20px"
          />
        </div>
        <div class="head-container">
          <el-tree
            :data="deptOptions"
            :expand-on-click-node="false"
            ref="tree"
            default-expand-all
            highlight-current
            @node-click="handleNodeClick"
          />
        </div>
      </el-col>
      <!--用户数据-->
      <el-col :span="20" :xs="24">

        <div class="text-center" style="height: 804px ;overflow:auto; ">


          <el-tabs v-model="activeName" type="card" @tab-click="handleClick" v-if="stattwo">
<!--            <el-tab-pane label="未整理文件" name="first" > <indexbox :statusPd= 0  v-if="isFirst"/></el-tab-pane>-->
            <el-tab-pane label="已整理文件" name="second" ><indexbox :statusPd= 1  v-if="isSecond" /></el-tab-pane>
            <el-tab-pane label="盒" name="third" ><box  v-if="isThird" /></el-tab-pane>
          </el-tabs>

          <el-tabs v-model="tactiveName" type="card" @tab-click="thandleClick" v-if="stat">
            <el-tab-pane label="未整理文件" name="tfirst" > <indexvolume :statusPd=0 v-if="itFirst"/></el-tab-pane>
            <el-tab-pane label="未整理案卷" name="tsecond" ><indexvolume :statusPd="1"  v-if="itSecond" /></el-tab-pane>
            <el-tab-pane label="已整理案卷" name="tthird" ><indexvolume  v-if="itThird" /></el-tab-pane>
          </el-tabs>


        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script >
import {treeselect} from "@/api/archives/dept";
import indexbox from "@/views/archives/collerctbox/yfilingindex";
import box from "@/views/archives/box/yfilingindex";
import indexvolume from "@/views/archives/volume/index";
export default {
  components: { indexbox ,indexvolume,box},
  name: "archiveindex",
  data() {
    return {
      // 部门树选项
      deptOptions: undefined,
      // 部门名称
      deptName: undefined,
      deptId : null,
      activeName: 'second',
      tactiveName: 'tfirst',
      isSecond: true,
      isThird: false,
      itFirst: true,
      itSecond: false,
      itThird: false,
      shellOpen: false,
      stat:false,
      stattwo : true,
      reportUrl : null
    };
  },

  watch: {
    // 根据名称筛选部门树
    deptName(val) {
      this.$refs.tree.filter(val);
    },
  },

  created() {
    this.getTreeselect();
  },
  methods: {
    /** 查询部门下拉树结构 */
    getTreeselect() {
      treeselect().then(response => {
        this.deptOptions = response.data;
      });
    },
    // 节点单击事件
    handleNodeClick(data) {
      this.deptId = data.id;

      this.stattwo =  this.stattwo == false ? true : false;
      this.stat = this.stat == false ? true : false;
    },

    handleClick(tab) {
     if (tab.name == 'second') {
        this.isSecond = true
        this.isThird = false
      }else if (tab.name == 'third') {
        this.isSecond = false
        this.isThird = true
      }
    },

    thandleClick(tab) {
      if (tab.name == 'tfirst') {
        this.itFirst = true
        this.itSecond = false
        this.itThird = false
      }else if (tab.name == 'tsecond') {
        this.itFirst = false
        this.itSecond = true
        this.itThird = false
      }else if (tab.name == 'tthird') {
        this.itFirst = false
        this.itSecond = false
        this.itThird = true
      }
    },

  }
};
</script>