Compare commits

...

3 Commits

  1. 7090
      pnpm-lock.yaml
  2. 9
      src/api/user/resource.js
  3. BIN
      src/assets/icons/pdf (1).png
  4. BIN
      src/assets/icons/ppt (1).png
  5. BIN
      src/assets/icons/ppt (2).png
  6. BIN
      src/assets/icons/图片 (2).png
  7. BIN
      src/assets/icons/文件.png
  8. BIN
      src/assets/icons/视频 .png
  9. BIN
      src/assets/icons/音频1.png
  10. 10
      src/config/index.js
  11. 23
      src/utils/oss.js
  12. 20
      src/views/MyCourseStudy/learningProcess.vue
  13. 5
      src/views/courseResources/componse/resourceAdd.vue
  14. 133
      src/views/courseResources/courseInfo.vue
  15. 781
      src/views/courseResources/index.vue

File diff suppressed because it is too large Load Diff

@ -0,0 +1,9 @@
import request from '@/utils/request'
//获取ppt资源列表
export const getpptResourceListService = (params) =>
request.get('http://localhost:8080/courses/getall', { params })
export function DelpptResourceListService(ids) {
return request.delete(
`http://localhost:8080/learningrecords/delete?ids=${ids}`,
)
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 KiB

@ -0,0 +1,10 @@
import OSS from 'ali-oss'
export const client = new OSS({
bucket: 'wenyu132', //bucket名称
region: 'oss-cn-beijing', //区域
endpoint: 'oss-cn-beijing.aliyuncs.com', //地域节点==>外网访问
accessKeyId: 'LTAI5tPe9x46aWZt8FScytst', //访问键id
accessKeySecret: '0mfxSLzmRgtHMXpD5pCBTl9RfwbmDG', //访问密钥
secure: true, //http就是false,https就是true
})

@ -0,0 +1,23 @@
import { client } from '@/config/index.js'
import { nanoid } from 'nanoid' //随机函数
const tool = {
oss: {
async upload(file) {
// 文件名
const uuid = nanoid()
// 文件后缀名
const index = file.name.lastIndexOf('.')
const suffix = file.name.substring(index + 1)
//完整路径
let fileName = 'wenyu/' + uuid + '.' + suffix
return await client.multipartUpload(fileName, file, {
progress: function (p) {
console.log('进度', p)
},
})
},
},
}
export default tool

@ -1,10 +1,11 @@
<script setup> <script setup>
// import router from '@/router' // import router from '@/router'
import { ref } from 'vue' import { ref } from 'vue'
import { getRecordListService, DelRecordService } from '@/api/user/record.js' //getRecordListService,
import { DelRecordService } from '@/api/user/record.js'
import { ElMessageBox, ElMessage } from 'element-plus' import { ElMessageBox, ElMessage } from 'element-plus'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { LearningRecordsControllerService } from '../../../generated/services/LearningRecordsControllerService'
const total = ref(0) const total = ref(0)
const recordList = ref([]) const recordList = ref([])
const selectedIds = ref([]) const selectedIds = ref([])
@ -18,8 +19,13 @@ const params = ref({
// //
const getrecordList = async () => { const getrecordList = async () => {
console.log(1111111)
loading.value = true loading.value = true
const res = await getRecordListService(params.value)
// const res = await getRecordListService(params.value)
const res = await LearningRecordsControllerService.getAllUsingGet3(
params.value,
)
recordList.value = res.data.records recordList.value = res.data.records
console.log(res) console.log(res)
// //
@ -54,6 +60,13 @@ const onDeleteRecord = async (ids) => {
ElMessage({ type: 'success', message: '删除成功' }) ElMessage({ type: 'success', message: '删除成功' })
getrecordList() getrecordList()
} }
//
const toggleCheckbox = () => {
showCheckbox.value = !showCheckbox.value
if (showCheckbox.value) {
showCheckbox.value = []
}
}
// //
// change toggleSelection // change toggleSelection
// id selectedIds // id selectedIds
@ -103,6 +116,7 @@ const goToAnotherPage = (address) => {
//console.log(address) //console.log(address)
router.push(address) router.push(address)
} }
//
</script> </script>
<template> <template>

@ -0,0 +1,5 @@
<script setup></script>
<template>
<div></div>
</template>
<style scoped></style>

@ -1,133 +0,0 @@
<template>
<div class="ch">
<video
src="D:\前端\前端code\vedio\薛之谦 - 病态.mp4"
width="240px"
controls
>
法学
</video>
<div class="ch1">
<p>开课时间2018年11月14日~2023年11月14日</p>
<p>课程类型公共开放课程</p>
<p>学习人数120</p>
</div>
</div>
<div class="ma"></div>
<div class="en"></div>
<div class="ph"></div>
<div class="or"></div>
<div class="warpper"></div>
<div class="vo">
请选择院系专业:
<button>
<select>
<option>国际教育学院</option>
<option>能源工程学院</option>
<option>体育学院</option>
<option>马克思主义学院</option>
<option>智能制造学院</option>
<option>商务英语学院</option>
</select>
</button>
<button>
<select>
<option>01</option>
<option>02</option>
<option>03</option>
<option>04</option>
<option>05</option>
</select>
</button>
<br />
请选择年级:
<button>
<select>
<option>大一</option>
<option>大二</option>
<option>大三</option>
<option>大四</option>
</select>
</button>
<br />
上传学科文件
<input type="file" />
<form>
<button type="submit">提交</button>
<button type="reset">重置</button>
<br />
<div style="width: 100%; display: flex; justify-content: space-between">
<button>上一页</button>
<button>下一页</button>
</div>
</form>
</div>
</template>
<script lang="ts" setup>
import {} from 'vue'
</script>
<style lang="scss" scoped>
.ch {
height: 300px;
width: 240px;
float: left;
line-height: 1.5;
margin-right: 5px;
background-color: rgba(183, 126, 164, 0.17);
box-sizing: border-box;
}
.ma {
height: 300px;
width: 240px;
float: left;
line-height: 1.5;
margin-right: 5px;
background-color: rgba(183, 126, 164, 0.17);
box-sizing: border-box;
}
.en {
height: 300px;
width: 240px;
float: left;
line-height: 1.5;
margin-right: 5px;
background-color: rgba(183, 126, 164, 0.17);
box-sizing: border-box;
}
.ph {
height: 300px;
width: 240px;
float: left;
line-height: 1.5;
margin-right: 5px;
background-color: rgba(183, 126, 164, 0.17);
box-sizing: border-box;
}
.warpper {
width: 1222px;
height: 300px;
float: left;
background-color: rgb(202, 194, 236);
box-sizing: border-box;
}
.or {
height: 300px;
width: 240px;
float: left;
line-height: 1.5;
margin-right: 5px;
background-color: rgba(183, 126, 164, 0.17);
box-sizing: border-box;
}
.vo {
width: 1222px;
height: 130px;
background-color: rgb(250, 225, 243);
border: solid 1px rgb(220, 214, 214);
float: left;
}
.ch.ch1 {
}
</style>

@ -1,569 +1,328 @@
<script setup>
//
import ppt from '@/assets/icons/ppt (1).png'
import image from '@/assets/icons/图片 (2).png'
import video from '@/assets/icons/视频 .png'
import pdf from '@/assets/icons/pdf (1).png'
import test from '@/assets/icons/文件.png'
import audio from '@/assets/icons/音频1.png'
import { ref } from 'vue'
//
const visibleDramwer = ref(false)
//selectedOption
const selectedOption = ref('')
import { getpptResourceListService } from '@/api/user/resource.js'
import { DelpptResourceListService } from '@/api/user/resource.js'
const total = ref(0)
const pptresourceList = ref([])
const loading = ref(false)
const params = ref({
pagesize: '15',
pagenum: '1',
type: '1', //ppt
})
//
const getpptresourceList = async () => {
loading.value = true
const res = await getpptResourceListService(params.value)
pptresourceList.value = res.data.records
console.log(res)
//
total.value = res.data.total
loading.value = false
}
getpptresourceList()
//type
const changeType = (newtype) => {
params.value.type = newtype
//console.log(params.value.type)
getpptresourceList()
}
//
const onSizeChange = (size) => {
console.log('当前每页条数', size)
//访
//
params.value.pagenum = 1
params.value.pagesize = size
//
getpptresourceList()
}
const onCurrentChange = (page) => {
pptresourceList.value.pagenum = page
getpptresourceList()
}
// -ID
const onDeleteResource = async (ids) => {
await ElMessageBox.confirm('你确认删除该条浏览信息吗?', '温馨提示', {
type: 'warning',
confirmButtonText: '确认',
cancelButtonText: '取消',
})
await DelpptResourceListService(ids)
// console.log(ids)
ElMessage({ type: 'success', message: '删除成功' })
getpptresourceList()
}
//
import tool from '@/utils/oss.js'
const FileList = ref([])
const upload = async (option) => {
const res = await tool.oss.upload(option.file)
console.log(22, res)
console.log(res.name)
const url = 'https://wenyu132.oss-cn-beijing.aliyuncs.com/' + res.name
console.log(url)
}
</script>
<template> <template>
<div> <div>
<div class="top"> <div class="top">
<div class="loop active-nav" @click="click($event, 2)"> <el-button @click="visibleDramwer = true">添加资源</el-button>
<img <el-drawer v-model="visibleDramwer">
src="../../assets/icons/课程简介.svg" <!-- 添加资源表单 -->
alt="" <el-form>
width="50px" <el-form-item label="资源名称">
height="50px" <el-input placeholder="请输入资源名称"></el-input>
/> </el-form-item>
<p>简介</p> <el-form-item label="资源类型">
</div> <el-select v-model="selectedOption" placeholder="资源类型">
<div class="loop" @click="click($event, 1)"> <el-option
<img class="vertical-option"
src="../../assets/icons/ppt.svg" label="选项1"
alt="" value="1"
width="50px" ></el-option>
height="50px" <el-option
/> class="vertical-option"
<p>ppt</p> label="选项2"
</div> value="2"
<div class="loop" @click="click($event, 0)"> ></el-option>
<img <el-option
src="../../assets/icons/视频.svg" class="vertical-option"
alt="" label="选项3"
width="50px" value="3"
height="50px" ></el-option>
/> </el-select>
<p>视频</p> </el-form-item>
</div> <el-form-item label="资源简介">
<div class="loop" @click="click($event, 3)"> <el-input placeholder="请输入资源简介"></el-input>
<img </el-form-item>
src="../../assets/icons/文本.svg" <el-form-item label="上传资源">
alt="" <el-upload
width="50px" v-model:file-list="FileList"
height="50px" :http-request="upload"
/> class="upload-demo"
<p>文本</p>
</div>
<div class="loop" @click="click($event, 4)">
<img
src="../../assets/icons/音频.svg"
alt=""
width="50px"
height="50px"
/>
<p>音频</p>
</div>
</div>
<div class="body" v-if="activeIndex == 0">
<ul>
<li v-for="(item, index) in videoList" :key="index">
<video :src="item.url" controls width="390px"></video>
<div class="text1">
软件工程的奥秘
<br />
构建无暇的应用程序关键技巧
</div>
<form action="">
<input
type="file"
multiple multiple
@change="uploadChange"
style="cursor: pointer"
/>
<br />
<button
type="submit"
@click="submitUploadFile"
style="cursor: pointer"
>
上传
</button>
<button>
<a
href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D"
download=""
> >
下载 <el-button type="primary">点击上传</el-button>
</a> <template #tip>
</button> <div class="el-upload__tip">
<button type="reset" style="cursor: pointer">重选</button> 只能上传jpg/png文件,且不超过500kb
</form>
</li>
</ul>
</div> </div>
</template>
</el-upload>
</el-form-item>
<div class="body" v-if="activeIndex == 1"> <el-form-item class="bottom-box">
<ul> <el-button type="info" @click="onRemoval">取消</el-button>
<li v-for="(item, index) in pptList" :key="index"> <el-button type="primary">确定</el-button>
<img :src="item.url" title="ppt" height="200px" width="390px" /> </el-form-item>
<div class="text1"> </el-form>
软件工程的奥秘 </el-drawer>
<br />
构建无暇的应用程序关键技巧
</div> </div>
<form action=""> <div class="body">
<input type="file" multiple @change="uploadChange" /> <div class="nav">
<br /> <el-row>
<button <el-col :span="4" @click="changeType('1')">
type="submit" <div class="nav-info">
@click="submitUploadFile" <div class="nav-info-pic">
style="cursor: pointer" <img :src="ppt" style="height: 50px" />
>
上传
</button>
<button>
<a
href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D"
download=""
>
下载
</a>
</button>
<button type="reset" style="cursor: pointer">重选</button>
</form>
</li>
</ul>
</div> </div>
<div class="body" v-if="activeIndex == 2"> <div class="nav-info-name">ppt</div>
<ul>
<li>
<img
src="../../assets/images/软件1.png"
title="软件工程的奥秘"
width="390px"
height="200px"
/>
<div class="text1">
软件工程的奥秘
<br />
构建无暇的应用程序关键技巧
</div> </div>
<div class="text2"> </el-col>
课程类型:公共任选课 <el-col :span="4" @click="changeType('2')">
<br /> <div class="nav-info">
授课老师:王易系 <div class="nav-info-pic">
<br /> <img :src="image" style="height: 50px" />
报名人数:130
</div> </div>
</li> <div class="nav-info-name">图片</div>
<li>
<img
src="../../assets/images/软件2.png"
title="顶级工程师"
width="390px"
height="200px"
/>
<div class="text1">
如何成为顶级工程师
<br />
成功之路解析
</div> </div>
<div class="text2"> </el-col>
课程类型:公共任选课
<br /> <el-col :span="4" @click="showComponent('3')">
授课老师:刘苏杭 <div class="nav-info">
<br /> <div class="nav-info-pic">
报名人数:126 <img style="height: 50px" :src="video" />
</div> </div>
</li> <div class="nav-info-name">视频</div>
<li>
<img
src="../../assets/images/软件3.png"
title="软件黑科技"
width="390px"
height="200px"
/>
<div class="text1">
软件工程的黑科技
<br />
提高开发效率的秘密技巧大揭秘
</div> </div>
<div class="text2"> </el-col>
课程类型:公共任选课 <el-col :span="4">
<br /> <div class="nav-info">
授课老师:安书名 <div class="nav-info-pic" @click="showComponent('4')">
<br /> <img style="height: 50px" :src="pdf" />
报名人数:117
</div> </div>
</li> <div class="nav-info-name">PDF</div>
<li>
<img
src="../../assets/images/软件4.png"
title="未来趋势"
width="390px"
height="200px"
/>
<div class="text1">
软件工程界的未来趋势
<br />
AI大数据和区块的巨大影响
</div> </div>
<div class="text2"> </el-col>
课程类型:公共任选课 <el-col :span="4" @click="showComponent('5')">
<br /> <div class="nav-info">
授课老师:萨基姆 <div class="nav-info-pic">
<br /> <img style="height: 50px" :src="test" />
报名人数:140
</div> </div>
</li> <div class="nav-info-name">文件</div>
<li>
<img
src="../../assets/images/软件5.png"
title="避免陷阱"
width="390px"
height="200px"
/>
<div class="text1">
软件工程中常见的陷阱级如何避免
<br />
优化你的开发过程
</div> </div>
<div class="text2"> </el-col>
课程类型:公共任选课 <el-col :span="4" @click="showComponent('6')">
<br /> <div class="nav-info">
授课老师:何舒心 <div class="nav-info-pic">
<br /> <img style="height: 50px" :src="audio" />
报名人数:125
</div> </div>
</li> <div class="nav-info-name">音频</div>
<li>
<img
src="../../assets/images/软件6.png"
title="必备工具"
width="390px"
height="200px"
/>
<div class="text1">
精通软件工程的必备工具
<br />
代码管理测试和持续集成
</div> </div>
<div class="text2"> </el-col>
课程类型:公共任选课 </el-row>
<br />
授课老师:朱佳娜
<br />
报名人数:121
</div>
</li>
<li>
<img
src="../../assets/images/软件7.png"
title="面试攻略"
width="390px"
height="200px"
/>
<div class="text1">
软件工程师面试攻略
<br />
如何在技术中脱颖而出
</div> </div>
<div class="text2">
课程类型:公共任选课 <div class="body">
<br /> <!-- ppt资源列表 -->
授课老师:胡树立 <div class="courseResourcesList">
<br /> <ul v-if="pptresourceList.length > 0">
报名人数:117 <li
</div> v-for="resource in pptresourceList"
</li> :key="resource.id"
<li> v-loading="loading"
<img >
src="../../assets/images/软件8.png" <div>
alt="实战经验" <div class="icon">
width="390px" <el-icon @click="onDeleteResource(ids)">
height="200px" <Delete />
/> </el-icon>
<div class="text1"> <el-icon>
软件工程实战经验分析 <Edit />
<br /> </el-icon>
高效团队合作的秘密武器
</div> </div>
<div class="text2"> <div class="vedio">
课程类型:公共任选课 <img style="height: 200px" :src="resource.img" />
<br />
授课老师:张海山
<br />
报名人数:125
</div> </div>
</li> <div class="resource-info">
</ul> <div class="zy-name">{{ resource.name }}</div>
<div class="zy-info">{{ resource.description }}</div>
</div> </div>
<div class="body" v-if="activeIndex == 3">
<ul>
<li v-for="(item, index) in textList" :key="index">
<img
src="../../assets/icons/文本1.png"
title="软件工程的奥秘"
width="390px"
height="200px"
/>
<textarea name="" id="">点击输入文本内容:</textarea>
<form action="">
<input
type="file"
multiple
@change="uploadChange"
style="cursor: pointer"
/>
<br />
<button
type="submit"
@click="submitUploadFile"
style="cursor: pointer"
>
上传
</button>
<button>
<a
href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D"
download=""
>
下载
</a>
</button>
<button type="reset" style="cursor: pointer">重选</button>
</form>
</li>
</ul>
</div> </div>
<div class="body" v-if="activeIndex == 4">
<ul>
<li v-for="(item, index) in audioList" :key="index">
<img
src="../../assets/icons/音乐.png"
title="软件工程的奥秘"
width="390px"
height="180px"
/>
<div class="text1">点击播放软件工程的奥秘</div>
<video
src="../../assets/images/1.mp3"
controls
height="50px"
width="300px"
></video>
<!-- <audio src="../../assets/images/1.mp3" controls></audio> -->
<form action="">
<input
type="file"
multiple
@change="uploadChange"
style="cursor: pointer"
/>
<br />
<button
type="submit"
@click="submitUploadFile"
style="cursor: pointer"
>
上传
</button>
<button>
<a
href="http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D"
download=""
>
下载
</a>
</button>
<button type="reset" style="cursor: pointer">重选</button>
</form>
</li> </li>
</ul> </ul>
</div> </div>
<div class="" @click="gotoinfo"></div> <!-- 分页 -->
<div class="buttom"> <div class="pagination">
<el-pagination <el-pagination
background v-model:current-page="currentPage4"
layout="prev, pager, next,total" v-model:page-size="pageSize4"
:page-size="pageSize" :page-sizes="[1, 2, 3, 4]"
:small="small"
:disabled="disabled"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="total" :total="total"
class="pagination" @current-change="onCurrentChange"
:pager-count="11" @size-change="onSizeChange"
@current-change="currentChange" style="margin-top: 20px; justify-content: flex-end"
/> />
</div> </div>
</div> </div>
</div>
</div>
</template> </template>
<script setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { aaaApi } from '../../api/courseChaptersApi'
// import {getVideoUrlApi} from 'src/api/assats'
import { uploadFile } from '../../api/courseChaptersApi'
const activeIndex = ref(0)
const router = useRouter()
const gotoinfo = () => {
console.log(router)
router.push('/courseResourcesManagement/courseInfo')
}
function click(e, index) {
document
.querySelectorAll('.loop')
.forEach((item) => item.classList.remove('active-nav'))
e.currentTarget.classList.add('active-nav')
activeIndex.value = index
}
//====================
const page = ref(1)
const total = ref(50)
const pageSize = ref(8)
const videoList = ref([
{ url: '1' },
{ url: '2' },
{ url: '3' },
{ url: '4' },
{ url: '5' },
{ url: '6' },
{ url: '7' },
{ url: '8' },
])
const pptList = ref([
{ url: '/src/assets/images/0.jpg' },
{
url: 'http://ceshi132132.oss-cn-wuhan-lr.aliyuncs.com/img/1c52b390170a4734aba783a5473e891b.jpg?Expires=1717731833&OSSAccessKeyId=LTAI5tFkdu3y5WddxbjgaG2F&Signature=KtuZCTVO7cbwZAdD7ytpphkYhLw%3D',
},
{ url: '3' },
{ url: '4' },
{ url: '5' },
{ url: '6' },
{ url: '7' },
{ url: '8' },
])
const textList = ref([
{ url: '1' },
{ url: '2' },
{ url: '3' },
{ url: '4' },
{ url: '5' },
{ url: '6' },
{ url: '7' },
{ url: '8' },
])
const audioList = ref([
{ url: '1' },
{ url: '2' },
{ url: '3' },
{ url: '4' },
{ url: '5' },
{ url: '6' },
{ url: '7' },
{ url: '8' },
])
function changePage() { <style lang="scss" scoped>
// aaaApi(`?page=${page.value}&pageSize=${pageSize.value}`).then(res=>{ .el-row {
// // @ts-ignore margin-bottom: 20px;
// videoList.vlue =res.list background-color: #fff;
// // @ts-ignore height: 70px;
// total.value = res.total
// })
} }
function currentChange(number) { .el-col {
console.log(number, 'num') border-radius: 4px;
page.value = number
changePage()
} }
const file = ref(null) .nav-info {
const uploadChange = (e) => { display: flex;
console.log(e.target.files[0]) text-align: center;
file.value = e.target.files[0] flex-direction: column;
} }
const uploadFileEvent = () => {} .body {
const submitUploadFile = async () => { background-color: #fff;
const formData = new FormData() height: 100%;
formData.append('courseId', 1)
formData.append('file', file.value)
await uploadFile(formData)
} }
//============
</script>
<style lang="scss">
.top { .top {
width: 1620px; margin-bottom: 20px;
height: 100px; }
.nav-info-pic .img {
height: 50px;
width: 50px;
}
.bottom-box {
//display: flex
float: right;
}
ul {
list-style-type: none;
padding: 10;
display: flex; display: flex;
justify-content: space-around; flex-wrap: wrap;
border: 1px solid rgb(187, 181, 181); /* justify-content: space-evenly; */
background-color: rgb(255, 255, 255); justify-content: start;
}
li {
transition: filter 0.3s; /* 添加过渡动画 */
flex: 0 0 20%;
li { margin-bottom: 10px;
height: 99px !important; padding: 10px;
border-bottom: 1px solid; box-sizing: border-box;
}
& > * { transition: box-shadow 0.3s;
transition: 0.1s;
cursor: pointer; cursor: pointer;
}
.active-nav {
border-bottom: 5px solid blue !important;
}
} }
li:hover {
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
.body { .body {
width: 1620px;
height: 680px;
display: flex; display: flex;
background-color: rgb(237, 237, 238); flex-direction: column;
min-height: 100vh;
} }
.courseResourcesList {
li { flex: 1;
list-style-type: none;
} }
.pagination {
.body ul { position: sticky;
width: 100%; bottom: 0;
margin: 0 auto;
}
.icon {
display: flex; display: flex;
flex-wrap: wrap;
align-content: space-evenly;
justify-content: space-between; justify-content: space-between;
} }
.resource-info {
.body li { display: flex;
height: 320px; flex-direction: column;
width: 390px; justify-content: space-between;
background-color: rgb(237, 237, 238);
}
.loop {
width: 100px;
height: 99px;
text-align: center;
padding: 20px;
border-bottom: 1px solid rgb(187, 181, 181);
background-color: rgb(253, 252, 252);
}
.body .text1 {
font-size: 25px;
line-height: 30px;
} }
.zy-name:hover {
.body .text2 { color: rgb(138, 201, 243); /* 鼠标经过时将字体颜色设置为蓝色 */
font-size: 18px;
line-height: 20px;
color: rgb(186, 43, 11);
} }
.body a { .zy-name {
all: initial; margin-top: 10px;
cursor: pointer; font-size: 20px;
} }
.buttom { .zy-info {
width: 100%; margin-top: 20px;
display: flex;
justify-content: center;
align-items: center;
// .pagination{
// width: ;
// $height:150px;
// height: $height;
// button,li{
// height: $height !important;
// }
} }
</style> </style>
<!-- 上传git
git add .
git commit -m '介绍'
git pull
git push
-->

Loading…
Cancel
Save