<template>
  <div>

    <el-card shadow="never"
             class="aui-card--fill">
      <el-tabs v-model="activeName"
               @tab-click="tabClick()"
               class="el-tabs">
        <el-tab-pane label="居民端"
                     name="resi">
          <my-temp-list ref="ref_resi"></my-temp-list>
        </el-tab-pane>
        <el-tab-pane label="工作端"
                     name="gov">
          <my-temp-list ref="ref_work"></my-temp-list>
        </el-tab-pane>
      </el-tabs>
    </el-card>

  </div>
</template>

<script>
import MyTempList from './MyTempList'
import { requestPost } from "@/js/dai/request";

import { mapGetters } from 'vuex'
import { Loading } from 'element-ui' // 引入Loading服务

let loading// 加载动画

export default {
  data () {
    return {
      activeName: 'resi',
      workAppid: '',
      resiAppid: ''
    }

  },
  components: {
    MyTempList
  },

  mounted () {
  },

  methods: {

    init (workAppid, resiAppid, clientType) {
      this.workAppid = workAppid
      this.resiAppid = resiAppid

      if (clientType) {
        this.activeName = clientType
      }
      this.tabClick()

    },
    tabClick () {

      if (this.activeName === 'resi') {
        this.$refs['ref_resi'].init(this.resiAppid)
      } else if (this.activeName === 'gov') {
        this.$refs['ref_work'].init(this.workAppid)
      }
    },
    // 刷新
    refresh () {
      if (this.activeName === 'gov') {
        this.loadWorkTableData() // 获取表格数据
      } else if (this.activeName === 'resi') {
        this.loadResiTableData() // 获取表格数据
      }
    },
    doLayout () {
      this.$nextTick(() => {
        if (this.activeName === 'gov') {
          this.$refs['ref_work'].doLayout() // 解决表格错位
        } else if (this.activeName === 'resi') {
          this.$refs['ref_resi'].doLayout() // 解决表格错位
        }

      })
    },


    // 开启加载动画
    startLoading () {
      loading = Loading.service({
        lock: true, // 是否锁定
        text: '正在加载……', // 加载中需要显示的文字
        background: 'rgba(0,0,0,.7)' // 背景颜色
      })
    },
    // 结束加载动画
    endLoading () {
      // clearTimeout(timer);
      if (loading) {
        loading.close()
      }
    }
  },
  computed: {
    tableHeight () {
      return this.clientHeight - 60 - 80 - 80
    },
    ...mapGetters(['clientHeight', 'env'])
  },
  props: {
    showFrom: {
      type: String,
      default: 'default'
    },
    //table的关键字
    tableKeywork: {
      type: String,
      default: 'FootBar'
    }
  }
}
</script>
<style>
.div_btn_default {
  z-index: 10;
  position: absolute;
  right: 40px;
  top: 35px;
  /* margin: 0 0 20px 0; */
}
.div_btn_customize {
  z-index: 10;
  position: absolute;
  right: 40px;
  top: 35px;
  /* margin: 0 0 20px 0; */
}
</style>
