<template>
  <div class="page-body">
    <q-tabs v-model="tabCheck" @input="getList" narrow-indicator dense align="left" class="text-primary q-mb-sm">
      <q-tab :ripple="false" :name="1" label="年份统计" />
      <q-tab :ripple="false" :name="2" label="成长率" />
    </q-tabs>
    <div class="col row wrap q-mb-lg" style="justify-content:space-between;">
      <div class="col row wrap" style="display:none;">
        <div class="col-2 Sysuser_Date q-mr-lg">
          <q-field filled dense>
            <template v-slot:control>
              <el-date-picker v-model="msg.YearStr" @change="getList" style="width:100%" value-format="yyyy" size="mini"
                type="year" placeholder="选择年">
              </el-date-picker>
            </template>
          </q-field>
        </div>
        <div class="col-2">
          <q-select filled dense stack-label @input="getList" clearable option-value="TId" @filter="filterTeacherFn" use-input option-label="TeacherName" v-model="msg.TeacherId"
            ref="Teacher_Id" :options="TeacherList" label="教师团队" class="col-6 q-pr-lg q-pb-lg" emit-value
            map-options />
        </div>
      </div>
      <div>
        <q-btn color="accent" class="q-mr-md" size="sm" icon="download" style="margin-top:15px;" label="下载"
          @click="downloadStudentStaticYear" />
      </div>
    </div>
    <yearFirst :dataList="dataList" :tabCheck="tabCheck"></yearFirst>
  </div>
</template>
<script>
  import {
    EduDownLoad
  } from "../../api/common/common";
  import yearFirst from '../sale/yearFirst';
  import {
    GetTeacherStaticYear,
    GetTeacherStaticYearRate
  } from '../../api/teacher/index';
  import {
    getTeacherDropDownList
  } from "../../api/school/index";

  export default {
    props: {},
    meta: {
      title: "教师年度数据统计"
    },
    components: {
      yearFirst
    },
    data() {
      return {
        tabCheck: 1,
        dataList: [],
        msg: {
          YearStr: '',
          TeacherId:'',
          rowsPerPage: 0
        },
        TeacherList:[],
        AllTeacherList:[]
      }
    },
    created() {

    },
    mounted() {
      let d = new Date();
      this.msg.YearStr = d.getFullYear().toString();
      this.GetTeacherList();
      this.getList();
    },
    methods: {
      //获取教师下拉
      GetTeacherList() {
        getTeacherDropDownList({}).then(res => {
          if (res.Code == 1) {
            this.TeacherList = res.Data;
            this.AllTeacherList = res.Data;
          }
        });
      },
      //课程教师
      filterTeacherFn(val, update, abort) {
        update(() => {
          this.TeacherList = this.AllTeacherList.filter(
            v => v.TeacherName.indexOf(val) > -1
          );
        });
      },
      //下载文件
      downloadStudentStaticYear() {
        this.loading = true;
        var msg = JSON.parse(JSON.stringify(this.msg));
        var url = "/TeacherStatic/DownLoadTeacherStaticYear";
        var fileName = "教师年数据统计.xls";
        if (this.tabCheck == 2) {
          url = "/TeacherStatic/DownLoadTeacherStaticYearRate";
          fileName = "教师年成长率数据统计.xls";
        }
        EduDownLoad(
          url,
          msg,
          fileName, res => {
            this.loading = false;
          }
        );
      },
      //获取数据
      getList() {
        if (this.tabCheck == 1) {
          this.loading = true;
          GetTeacherStaticYear(this.msg).then(res => {
            this.loading = false;
            if (res.Code == 1) {
              this.dataList = res.Data;
            }
          })
        } else {
          this.loading = true;
          GetTeacherStaticYearRate(this.msg).then(res => {
            this.loading = false;
            if (res.Code == 1) {
              this.dataList = res.Data;
            }
          })
        }
      }

    }
  }
</script>