<template>
  <div>
    <div style="color:#1c84c6;font-weight: 600;font-size: 16px;" v-show="queryParam.jieci">
      以下是 <span>{{queryParam.ywTime}}</span><span>第{{queryParam.jieci}}节课</span> 的课表
    </div>
    
    <div style="color:#1c84c6;font-weight: 600;font-size: 16px;" v-show="!queryParam.jieci">
      现在是 <span>{{queryParam.ywTime}}</span> 非上课时段 
    </div>

    
    <a-row style="margin-top:20px;">
      <a-col :xs="{ span: 24 }" :sm="{ span: 8 }" :lg="{ span: 4 }">
        <a-form-item label="" style="padding: 10px;">
          <JDictSelectTag placeholder="请选择院系" v-model:value="queryParam.kkdw"
            :dictCode="`kc_kkdw_view,kkdw,kkdw`" />
        </a-form-item>
      </a-col>
      <a-col :xs="{ span: 24 }" :sm="{ span: 8 }" :lg="{ span: 4 }">
        <a-form-item label="" style="padding: 10px;">
          <a-input placeholder="请输入课程或教师名称" v-model:value="queryParam.ywmc"></a-input>
        </a-form-item>
      </a-col>
      <a-col :xs="{ span: 24 }" :sm="{ span: 8 }" :lg="{ span: 4 }" style="padding: 10px;">
        <a-button type="primary" @click="zbLoadData" style="background-color:  rgb(26, 179, 148);">查询</a-button>
      </a-col>
    </a-row>

    <a-tabs v-model:activeKey="rkbActiveKey" type="card"  @change="zibiaoCard">
      <a-tab-pane key="1">
        <template #tab>
          <div>
            <div style="float: left;">完全线下课程</div>
            <div style="background-color: rgb(26, 179, 148);color: rgb(255, 255, 255);border-radius: 18px;width: 22px;text-align: center;float: left;margin-left: 10px;">
              {{xxkcTotal}}</div>
          </div>
        </template>
        <kclbList ref="wqxxkcModeal" :queryParam="xxkcqueryParam" @setTotal="xxkcTotal = $event;jzzyload()"></kclbList>

      </a-tab-pane>
      <a-tab-pane key="2">
        <template #tab>
          <div>
            <div style="float: left;">腾讯会议</div>
            <div
              style="background-color: rgb(26, 179, 148);color: rgb(255, 255, 255);border-radius: 18px;width: 22px;text-align: center;float: left;margin-left: 10px;">
              {{txhyTotal}}</div>
          </div>
        </template>
        <kclbList ref="txhyModeal" :queryParam="txhyqueryParam"  @setTotal="txhyTotal = $event;jzzyload()"></kclbList>
      </a-tab-pane>
    </a-tabs>
  </div>
</template>

<script lang="ts" setup>
import { ref,onMounted,defineExpose } from 'vue';
import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import kclbList from '/@/views/site/jrkclb/kclbList.vue';
import { defHttp } from '/@/utils/http/axios';

const emit = defineEmits(['jrkclbLoad']);
const rkbActiveKey = ref('1');
const jclist = (queryParam) => defHttp.get({ url: '/kcJieci/kcJieci/getIndexJcList', params:queryParam });
const queryParam = ref<any>({});
const xxkcqueryParam = ref<any>({});
const txhyqueryParam = ref<any>({});
const xxkcTotal = ref<any>(0);
const txhyTotal = ref<any>(0);
const wqxxkcModeal = ref();
const txhyModeal = ref();
function zbLoadData() {
  //----------------------线下课程-------------------
  xxkcqueryParam.value.skrq = queryParam.value.ywTime
  xxkcqueryParam.value.hh = queryParam.value.jieci+","+queryParam.value.jieci.split("、").join(',')
  xxkcqueryParam.value.kkdw = queryParam.value.kkdw
  xxkcqueryParam.value.ywmc = queryParam.value.ywmc
  xxkcqueryParam.value.skxs = 1
  xxkcqueryParam.value.type = 1

  //----------------------腾讯会议-------------------
  txhyqueryParam.value.skrq = queryParam.value.ywTime
  txhyqueryParam.value.hh = queryParam.value.jieci+","+queryParam.value.jieci.split("、").join(',')
  txhyqueryParam.value.kkdw = queryParam.value.kkdw
  txhyqueryParam.value.ywmc = queryParam.value.ywmc
  txhyqueryParam.value.zbpx = 1
  txhyqueryParam.value.ywskxs = '1'
  xxkcqueryParam.value.type = 1
  zibiaoCard(1);
}
/**
 * 加载主页数据
 */
function jzzyload(){
  emit('jrkclbLoad');
}
function zibiaoCard(index){
  if(index == 1){
    wqxxkcModeal.value.rkbLoadData();
  }else if(index == 2){
    txhyModeal.value.rkbLoadData();
    console.log(`🚀 ~ file: kclbZzsk.vue:86 ~ zibiaoCard ~ txhyModeal.value:`, txhyModeal.value)
  }
}
defineExpose({
  zbLoadData
});
//进入就加载
onMounted(() => {
  jclist(queryParam.value).then(res=>{
    var list = res
    queryParam.value.ywTime = list[0].kssj
    queryParam.value.jieci = list[0].jieci
    zbLoadData()
  })
});
</script>
<style scoped lang="less">
.ant-form-item {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.85);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    font-feature-settings: tnum;
    vertical-align: top;
}
</style>
