<template>
  <div>
    <div style="margin-top: 50px;width: 100%;display: flex">
      <div style="width: 300px;height: 200px;background-color: #8cc5ff;margin-left: 120px">
        <div style="align-content: center">
          <div style="padding-top: 60px;font-size: 30px;font-weight: bolder;color: #ffffff">{{classNum}}</div>
          <div style="padding-top: 10px;color: #ffffff">习题库</div>
        </div>
      </div>
    </div>
    <div style="display: flex">
      <div style="margin-left: 213px;margin-top: 20px">
        <el-button type="primary" @click="examination()">管理习题库</el-button>
      </div>
    </div>
    <div style="width: 100%;margin-top: 50px;display: flex">
      <div style="width: 300px;height: 200px;background-color: #f9a7a7;float: left;margin-left: 120px">
        <div style="align-content: center">
          <div style="padding-top: 60px;font-size: 30px;font-weight: bolder;color: #ffffff">{{courseNum}}</div>
          <div style="padding-top: 10px;color: #ffffff">随堂练习</div>
        </div>
        <div style="display: flex">
          <div style="margin-left: 93px;margin-top: 130px">
            <el-button type="primary">管理习题集</el-button>
          </div>
        </div>
      </div>
      <div style="width: 300px;height: 200px;background-color: #a4da89;float: left;margin-left: 100px">
        <div style="align-content: center">
          <div style="padding-top: 60px;font-size: 30px;font-weight: bolder;color: #ffffff">{{xtNum}}</div>
          <div style="padding-top: 10px;color: #ffffff">真题演练</div>
        </div>
      </div>
      <div style="width: 300px;height: 200px;background-color: #f0c78a;float: left;margin-left: 100px">
        <div style="align-content: center">
          <div style="padding-top: 60px;font-size: 30px;font-weight: bolder;color: #ffffff">{{ksNum}}</div>
          <div style="padding-top: 10px;color: #ffffff">自组试卷</div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { postRequest } from '../../utils/api'
export default {
  data () {
    return {
      classNum: '',
      courseNum: '',
      xtNum: '',
      ksNum: ''
    }
  },
  activated () {
  },
  created () {
    this.getTypeList()
  },
  mounted () {
  },
  methods: {
    getTypeList: function () {
      var _this = this;
      this.loading = true;
      postRequest('/edu/v1/mp/questionTj').then(resp=> {
        if (resp.status === 200) {
          if(resp.data.data.questionNum!==null) {
            this.classNum = resp.data.data.questionNum
          }else{
            this.classNum = 0
          }
          if(resp.data.data.stNum!==null) {
            this.courseNum = resp.data.data.stNum
          }else{
            this.courseNum = 0
          }
          if(resp.data.data.ztNum!==null) {
            this.xtNum = resp.data.data.ztNum
          }else{
            this.xtNum = 0
          }
          if(resp.data.data.zzNum!==null) {
            this.ksNum = resp.data.data.zzNum
          }else{
            this.ksNum = 0
          }
        } else {
          //失败
          _this.$alert('');
        }
      }, resp=> {
      });
    },
    examination(){
      // 打开路由
      this.$router.push({
        path: "/exercises-info",
        query: {
        }
      });
    },
  }
}
</script>
<style type="text/css">
  .crud__left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    float: left;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
  }
  .crud__right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
  }
</style>
