<template>
  <div class="tktjClass">
    <a-row>
      <a-col :span="24" style="text-align: center;"><strong style="font-size: 16px;">听评课周统计</strong></a-col>
      <a-col :span="24">
        <a-row>
          <a-col :span="6">
            <a-form-item label="" style="padding: 10px;">
              <JDictSelectTag placeholder="开课单位" v-model:value="queryParam.kkdw" :dictCode="`kc_kkdw_view,kkdw,kkdw`" @change="loadData"/>
            </a-form-item>
          </a-col>
          <a-col :span="6">
            <a-form-item label="" style="padding: 10px;">
              <JDictSelectTag placeholder="课程性质" v-model:value="queryParam.kcxz" dictCode="kc_kcxz" @change="loadData"/>
            </a-form-item>
          </a-col>
        </a-row>
      </a-col>
      <a-col :span="24">
        <div style="margin-top:0px;z-index: 0;">
          <tkztjTjt :chartData="barMultiData" height="300px" type="line"></tkztjTjt>
        </div>
      </a-col>
    </a-row>
  </div>
</template>
<script lang="ts" name="kcTingke-tkztj" setup>
import { ref,reactive,onMounted } from 'vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import tkztjTjt from '/@/views/kc/index/tpkztj/tpkztjTjt.vue';
import { dateFormat } from '/@/utils/common/compUtils';
import { defHttp } from '/@/utils/http/axios';

const barMultiData = reactive<any>([]);
const queryParam = ref<any>({});
const list = (queryParam) => defHttp.get({ url: '/kcTingke/kcTingke/getIndexTpkztjList', params:queryParam });

  //进入就加载
  onMounted(() => {
    const format = 'yyyy-MM-dd';
    const startTime = new Date();
    startTime.setTime(startTime.getTime()-60000*60*24*7)
    queryParam.value.startTime =  dateFormat(startTime, format)
    queryParam.value.endTime =  dateFormat(new Date(), format)
    loadData()
  });

  function loadData(){
    barMultiData.length = 0
    list(queryParam.value).then(res=>{
      console.log(`🚀 ~ file: tkztj.vue:59 ~ list ~ res:`, res)
      var list = res
      for(var i=0;i<list.length;i++){
        barMultiData.push({name: list[i].skrq, value: parseInt(list[i].kssl), type: '开课课堂数', seriesType: 'bar'})
        barMultiData.push({name: list[i].skrq, value: parseInt(list[i].tkkts), type: '听课课堂数', seriesType: 'line'})
        barMultiData.push({name: list[i].skrq, value: parseInt(list[i].tkrcs), type: '听课人次', seriesType: 'line'})
        barMultiData.push({name: list[i].skrq, value: parseInt(list[i].pkrc), type: '评课人次', seriesType: 'line'})
      }
      console.log(`🚀 ~ file: tkztj.vue:67 ~ list ~ barMultiData:`, barMultiData)
    })
  }
    
   
</script>
<style lang="less" scoped>
</style>
