Compare commits

...

2 Commits

Author SHA1 Message Date
于鹏飞 bea2979765 一次提交 5 months ago
于鹏飞 f13156cddb 知识点收藏页面修改 5 months ago
  1. 3
      src/api/courseChaptersApi.ts
  2. 46
      src/views/MyCourseStudy/ContainerCla.vue
  3. 79
      src/views/MyCourseStudy/ContainerKno.vue
  4. 97
      src/views/MyCourseStudy/courseCollections.vue

@ -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

@ -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>

@ -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);

@ -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() {
const params = {
// 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;

Loading…
Cancel
Save