<template>
<div class="main-contain">
  <div class="position">
     <bread-crumb :crumbs="crumbs"></bread-crumb>

  </div>
  <div class="app-container">

    <el-tabs v-model="activeName"  ref="elTabs">
        <el-tab-pane name="thisWeek">
            <span slot="label"><i class="el-icon-date"></i> 本周（{{theWeek.thisWeek}}）</span>
        </el-tab-pane>
        <!--<el-tab-pane name="nextWeek">-->
            <!--<span slot="label"><i class="el-icon-date"></i> 下周（{{theWeek.nextWeek}}）</span>-->
        <!--</el-tab-pane>-->
    </el-tabs>
    <table-push v-if="activeName=='pushTime'"></table-push>
    <table-weeks v-else :week-time="activeName"> </table-weeks>
  </div>
</div>
</template>

<script>
import {getWeekPanels} from '@/api/schedule';
import tableWeeks from './components/tableWeeks'
import tablePush from './components/tablePush'
import BreadCrumb from '../components/bread-crumb'
export default {
    name:'remind',
     data() {
      return {
        crumbs: [
          { path: false, name: '排班管理' },
          { path: '/workforce/remind', name: '排班提醒' },
        ],
        activeName: 'thisWeek',
        theWeek:{thisWeek:0,nextWeek:0,}
      };
    },
    components:{
      BreadCrumb,
        tableWeeks,
        tablePush
    },
    methods: {

      getWeekPanels(){
        getWeekPanels(0).then(response=>{
          if (response.data.state==0) {
            return false
          }
          this.theWeek.thisWeek = response.data.data.theWeek;
          this.theWeek.nextWeek = this.theWeek.thisWeek+1;

          let childrenRefs = this.$refs.elTabs.$children
          this.$nextTick(() => {
            childrenRefs.forEach(child => child.$forceUpdate())
          })
        });
      },
      handleClick(tab, event) {
        console.log(tab, event);
      }
    },
    created(){
        this.getWeekPanels();
    }
};
</script>

<style  rel="stylesheet/css" lang="scss" scoped>


</style>

