知识点收藏页面修改

src/api/courseChaptersApi.ts

@@ -8,7 +8,8 @@ export function getAssApi(params: {
   page: number,
   pageSize: number,
   resourceIdList: string,
-  type: 1 | 2 | 3 | 4 | 5
+  type: 1 | 2 | 3 | 4 | 5,
+  userId: string
 }) {
   return request.get('/Favour/get', {
     params

src/views/MyCourseStudy/ContainerCla.vue

@@ -2,12 +2,14 @@
   <!-- 课程收藏页面 -->
   <el-tab-pane label="课程收藏" name="first">
     <div class="Container_Cla" ref="container">
-      <div class="item_1" v-for="(item_1, index) in datalist" :key="index">
+      <div class="item_1" v-for="item_1 in datalist" :key="item_1.id">
         <!-- 课程图片盒子 -->
         <div class="ClassImg">
           <!-- 更多图片盒子 -->
           <div class="ClassGd">
-            <img src="../../assets/icons/更多.svg" width="100%" height="100%" />
+            <!-- <img src="../../assets/icons/更多.svg" width="100%" height="100%" /> -->
+              <p>查看课程</p>
+              <p>取消收藏</p>
           </div>
           <!-- 课程图片 -->
           <img :src="item_1.img" />
@@ -40,7 +42,7 @@
   </el-tab-pane>
 </template>
 <script lang="ts" setup>
-import { ref, onMounted, onBeforeUnmount } from 'vue'
+import { ref, onMounted} from 'vue'
 import { SeCourseFavourControllerService } from '../../../generated/services/SeCourseFavourControllerService'
 import { CourseFavourQueryRequest } from 'generated/models/CourseFavourQueryRequest'
 // ===============================
@@ -69,27 +71,18 @@ onMounted(() => myObserver.observe(container.value))
 const total = ref(0)
 const datalist = ref([
   {
-    /**
-     * 课程学时
-     */
+    // 课程学时
     classhours: '',
-    /**
-     * 课程学分
-     */
+    //  课程学分
     credit: '',
     id: '',
     img: '',
     name: '',
-    /**
-     * 教师id
-     */
+    //  教师id
     teacher: '',
   },
 ])
-
-/**
- * 表单信息
- */
+// 表单信息
 let params = ref<CourseFavourQueryRequest>({
   current: 1,
   pageSize: 12,
@@ -97,7 +90,7 @@ let params = ref<CourseFavourQueryRequest>({
   sortOrder: '',
   userId: 2,
 })
-
+// 获取表单数据
 const getDatalist = async () => {
   const res = await SeCourseFavourControllerService.listPostByPageUsingPost1(
     params.value,
@@ -108,6 +101,7 @@ const getDatalist = async () => {
 
 getDatalist()
 
+// 分页选择
 const handleSizeChange = (size: any) => {
   // console.log(size)
   params.value.current = 1
@@ -200,10 +194,23 @@ const handleCurrentChange = (page: any) => {
 
 .ClassGd {
   position: absolute;
+  background-color: rgb(217, 217, 217 ,.5);
   display: none;
-  margin-top: -9px;
-  margin-left: 95%;
+  margin-left: 85%;
+  padding: 3px 5px ;
   cursor: pointer;
+  border-radius: 20%;
+  &>p{
+    margin-top: 3px ;
+    margin-bottom: 3px;
+    font-size: 10px;
+    font-weight: 350;
+    color: black;
+    &:hover{
+      color: #2952f6;
+      font-weight: 35s0;
+    }
+  }
 }
 
 .ClaCon {
@@ -255,4 +262,5 @@ const handleCurrentChange = (page: any) => {
   width: 100%;
   justify-content: center;
 }
+
 </style>

src/views/MyCourseStudy/ContainerKno.vue

@@ -1,22 +1,24 @@
 <template>
         <el-tab-pane label="知识点收藏" name="third">
           <div class="Container_Kno">
-            <div class="item_3" v-for="(item_3, index) in 10" :key="index">
+            <div class="item_3 noUpd" v-for="item_3 in arr" :onclick="handClick" :key="item_3.id">
               <div>
                 <div class="KnowledgeCollent">
                   <div class="KnoCon">
-                    <h4>课程名称</h4>
-                    <p>第{{ item_3 }}章-xxxx</p>
+                    <h4>{{ item_3.name }}</h4>
+                    <p>第{{ item_3.num }}章-{{item_3.zjname}}</p>
                   </div>
-                  <div class="KnoBtn" >
-                    <img src="../../assets/icons/更多.svg" alt="" />
+                  <div class="KnoBtn">
+                    <img class="cli" src="../../assets/icons/更多.svg" />
                   </div>
                 </div>
                 <div class="Knowledge_point">
                   <ul>
-                    <li v-for="(item, index) in 6" :key="index">
-                      知识点知识点知识点{{ item }} 
-                      <span class="btn" >×</span>
+                    <li v-for="(item, index) in 5" :key="index">
+                      &nbsp;
+                      {{ index + 1 }}. 知识点知识点知识点
+                      &nbsp;
+                      <span class="btn">×</span>
                       &nbsp;
                     </li>
                   </ul>
@@ -26,11 +28,64 @@
           </div>
         </el-tab-pane>
 </template>
-<script lang="ts" setup>
+<script setup>
+import {ref,reactive} from 'vue'
+
+function handClick(e){
+  if(e.target.classList.contains('cli')){
+this.classList.toggle('noUpd')
+  }
+
+}
+const arr = reactive([])
+
+
+const a =[
+  {
+    id:1,
+    name:"操作系统",
+    num:1,
+    zjname:'操作系统引论',
+    
+  },
+  {
+    id:2,
+    name:"跨文化交际",
+    num:1,
+  },
+  {
+    id:3,
+    name:"软件项目管理",
+    num:1,
+  },
+  {
+    id:4,
+    name:"英语课",
+    num:1,
+  },
+]
+arr.length=0
+arr.push(...a)
+
+
+const  ShowDel = ref(false)
+function XsDel(id){
+  const item = arr.find(o=>o.a.id==id)
+  item.ShowDel = !item.ShowDel
+}
 
 
 </script>
 <style lang="scss" scoped>
+.btn{
+  display: inline-block;
+}
+.item_3.noUpd{
+.btn{
+  display: none;
+}
+}
+
 .Container_Kno {
   width: 100%;
   height: 100%;
@@ -75,7 +130,7 @@
 
 .KnowledgeCollent h4 {
   margin-top: 3px;
-  font-size: 30px;
+  font-size: 27px;
   font-weight: 550;
   font-style: normal;
 }
@@ -110,10 +165,6 @@
   border-radius: 3px;
 }
 
-.btn {
-  display: none;
-}
-
 .btn:hover {
   cursor: pointer;
   color: rgb(15, 57, 76);

src/views/MyCourseStudy/courseCollections.vue

@@ -10,7 +10,7 @@
           <ul class="Container_Res_Tab">
             <li class="img-svg" @click="hsndelShow(1)">
               <img src="../../assets/icons/课程简介.svg" alt="简介" />
-              <br />
+              <br/>
               <p>简介</p>
             </li>
             <li class="img-svg" @click="hsndelShow(2)">
@@ -81,7 +81,7 @@
           <span>点击开了一个弹框</span>
           <template #footer>
             <div class="dialog-footer">
-              <video src=""></video>
+              <video src="https://www.bilibili.com/video/BV1HV4y1a7n4?p=50&vd_source=9e99d3200788d6043e077de463ef019b"></video>
             </div>
           </template>
         </el-dialog>
@@ -109,6 +109,9 @@
             </div>
             <div class="ResClaDic">
               <p>音频名称-----{{ item }}</p>
+              <el-button plain @click="centerDialogVisible = true">
+                点击播放
+              </el-button>
             </div>
           </div>
         </div>
@@ -131,20 +134,21 @@ import type { TabsPaneContext } from 'element-plus'
 import ContainerCla from './ContainerCla.vue'
 import ContainerKno from './ContainerKno.vue'
 import { getAssApi } from "@/api/courseChaptersApi";
+import { SeResourceFavourControllerService } from "../../../generated/services/SeResourceFavourControllerService";
 const centerDialogVisible = ref(false)
 
 const activeIndex = ref(1)
 function hsndelShow(index: number) {
   activeIndex.value = index
 }
-//=========================
-function handleApi(params) {
-  getAssApi(params).then(res => {
-    arr.value = res.data.records
-    total.value = res.data.total
-    console.log(arr.value, '-', total.value)
-  })
-}
+// //=========================
+// function handleApi(params) {
+//   getAssApi(params).then(res => {
+//     arr.value = res.data.records
+//     total.value = res.data.total
+//     console.log(arr.value, '-', total.value)
+//   })
+// }
 const arr = ref([])
 const total = ref(0)
 // 分页器
@@ -153,10 +157,10 @@ const pageSize1 = ref(10)
 const disabled = ref(false)
 
 const handleSizeChange = (val: number) => {
-  hand()
+  getDatalist()
 }
 const handleCurrentChange = (val: number) => {
-  hand()
+  getDatalist()
 }
 
 function initFenYie() {
@@ -168,24 +172,53 @@ function initFenYie() {
 
 watch(activeIndex, (newVal) => {
   initFenYie()
-  hand()
+  getDatalist()
 })
-function hand() {
+// function hand() {
+//   console.log(res)
+//   // handleApi(params)
+// }
+
  const params = {
+    current:currentPage1.value,
     type: activeIndex.value,
-    page: currentPage1.value,
     pageSize: pageSize1.value,
-    resourceIdList: '1,2,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20'
+    sortField:'',
+    sortOrder:'',
+    userId:'3'
   }
-  handleApi(params)
-}
-const obj = {
-  type: activeIndex.value,
-  page: currentPage1.value,
-  pageSize: pageSize1.value,
-  resourceIdList: '1,2,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20'
+
+ const datalist = ref([
+  {
+    
+    description:'',
+    id: '',
+    img:'',
+    name: '',
+    path:'',
+    status:'',
+    tags:'',
+     type: '',
+  },
+])
+
+const getDatalist = async () => {
+  const res = await SeResourceFavourControllerService.listPostByPageUsingPost3(params)
+  datalist.value = res.data.records
+  total.value = res.data.total
+  console.log(datalist.value[0])
 }
-handleApi(obj)
+getDatalist()
+// hand()
+// const obj = {
+//   type: activeIndex.value,
+//   page: currentPage1.value,
+//   pageSize: pageSize1.value,
+//   sortField:'',
+//   sortOrder:'',
+//   resourceIdList: ''
+// }
+// handleApi(obj)
 //=========================
 
 const activeName = ref('first')
@@ -348,9 +381,19 @@ const handleClick = (tab: TabsPaneContext, event: Event) => {
 }
 
 .item_2-2,
+.item_2-5{
+  width: 100%;
+  height: 300px;
+  margin-top: 20px;
+  border-left: 1px solid #e4e4e4;
+  border-top: 1px solid #e4e4e4;
+  overflow: hidden;
+  box-shadow: 2px 2px 2px 2px rgba(214, 212, 212, 0.5);
+  border-radius: 6px;
+  margin-bottom: 32px;
+}
 .item_2-3,
-.item_2-4,
-.item_2-5 {
+.item_2-4{
   width: 100%;
   height: 300px;
   margin-top: 20px;