学生端-首页-日历-完善显示与点击功能：只显示本月课程，点击某一课程时跟下方的进入课程是同一个功能

src/views/site/studentWdkc/studentRili.vue

@@ -1,15 +1,15 @@
 <template>
   <a-alert :message="`当前时间: ${tday}`" />
-  <a-calendar v-model:value="value"  @panelChange="onPanelChange">
+  <a-calendar v-model:value="value" @panelChange="onPanelChange">
-    <template #dateCellRender="{ current }" >
+    <template #dateCellRender="{ current }">
       <ul class="events">
         <li v-for="item in getListData(current)" :key="item.content" @click="handleKecheng(item)">
-          <a-badge :status="item.type" :text="item.content"  />
+          <a-badge status="success" :text="item.kcmc" />
         </li>
       </ul>
     </template>
     <!-- 去掉头部年月切换 -->
-    <template #headerRender="{current}">
+    <template #headerRender="{ current }">
     </template>
   </a-calendar>
 </template>
@@ -24,44 +24,39 @@ const value = ref<Dayjs>();
 const tday = ref<string>('');
 const studentKclist = ref<any>([]);
 const getListData = (value: Dayjs) => {
-      let listData;
+  //将当前日历循环到的日子格式化为yyyy-MM-dd
-      var vdays = value.date()
+  const formattedDate = value.format('YYYY-MM-DD');
-      for(var i=0;i<studentKclist.value.length;i++){
+  if (formattedDate.substring(0, 7) == tday.value) {
-        var item = studentKclist.value[i]
+    return studentKclist.value.filter(item => item.skrq === formattedDate);
-        if(item.days == vdays){
+  } else {
-          listData = item.list;
+    return [];
-        }
+  }
-      }
+};
-      return listData || [];
-    };
 
-    const onPanelChange = (value: Dayjs) => {
+const onPanelChange = (value: Dayjs) => {
-      tday.value = dateFormat(value,"yyyy-MM");
+  tday.value = dateFormat(value, "yyyy-MM");
-    };
+};
-    //点击课程信息
+//点击课程信息
-    function handleKecheng(record){
+function handleKecheng(record) {
-    console.log("🚀 ~ handleKecheng ~ record:", record)
+  console.log(`🚀 ~ openKecheng ~ record:`, record);
+  var jgh = record.jgh.split(",")[0];
+  // defHttp.post({ url: '/zyDbtx/zyDbtx/deleteByRwbhCreate', params: { rwbh: record.rwbh, fbr: jgh } }).then((res) => {
+  //   loaddata();
+  // });
+  var url = '/stuzy/StudentGonggaoList?rwbh=' + record.rwbh + '&xqxn=' + record.xnxq + "&teano=" + record.jgh;
+  window.open(url, '_blank');
+}
 
-    }
-    
 //进入就加载
 onMounted(() => {
-  tday.value = dateFormat(new Date(),"yyyy-MM");
+  tday.value = dateFormat(new Date(), "yyyy-MM");
-  studentKclist.value = [{'days':'3','list':[
-            { type: 'warning', content: '课程名称1' },
-            { type: 'success', content: '课程名称2' },
-          ]}]
-
   defHttp.get({ url: '/ktgl/kcKetangbiao/getStudentRiliKclist' }).then((res) => {
-    // dataSource.value = res.records;
+    res.forEach(element => {
-    console.log("🚀 ~ defHttp.get ~ res.records:", res)
+      studentKclist.value.push(element)
-    studentKclist.value = [{'days':'3','list':[
+    });
-            { type: 'warning', content: '课程名称1' },
-            { type: 'success', content: '课程名称2' },
-          ]}]
   });
 });
- 
+
 </script>
 <style scoped>
 .events {
@@ -69,6 +64,22 @@ onMounted(() => {
   margin: 0;
   padding: 0;
 }
+
+.events li {
+  border-radius: 2px;
+  cursor: pointer;
+  /* 鼠标指针变为小手 */
+  transition: background-color 0.3s;
+  /* 平滑的背景颜色变化 */
+}
+
+.events li:hover {
+  background-color: #a3a3a3;
+  /* 深灰色背景 */
+  color: white;
+  /* 如果需要的话，可以改变文字颜色以保证可读性 */
+}
+
 .events .ant-badge-status {
   overflow: hidden;
   white-space: nowrap;
@@ -76,13 +87,13 @@ onMounted(() => {
   text-overflow: ellipsis;
   font-size: 12px;
 }
+
 .notes-month {
   text-align: center;
   font-size: 28px;
 }
+
 .notes-month section {
   font-size: 28px;
 }
-</style>
+</style>
-
-

src/views/site/studentWdkc/studentWdkc.vue

@@ -3,12 +3,12 @@
     <div style="margin-top: 20px">
       <span style="margin-left: 30px; font-size: 24px; font-weight: 600">我的课程</span>
     </div>
-    <!-- <div>
+    <div>
       <studentRili></studentRili>
-    </div> -->
+    </div>
 
 
-    <div style="text-align: right; width: 100%; padding-right:20px">
+    <div style="text-align: right; width: 100%; padding-right:20px;margin-top:30px">
       <a-switch style="margin-top:-60px" v-model:checked="checked1" checkedChildren="卡片" unCheckedChildren="列表" />
     </div>
     <div v-if="checked1">