Merge pull request 'fix:修改样式;' (#413) from yangws into main

Reviewed-on: #413
This commit is contained in:
yangws 2024-11-20 17:03:06 +08:00
commit 28d6d2d705
1 changed files with 24 additions and 9 deletions

View File

@ -18,12 +18,15 @@
</el-form>
</div>
<div class="list-content">
<div class="list-container">
<div class="content-list" v-for="(item, index) in experimentList" :key="index">
<div class="list-container" v-loading="loading">
<div v-for="(item, index) in experimentList" :key="index" class="content">
<div class="content-list">
<!-- 封面 -->
<el-image style="width: 100%;border-radius: 8px;" :src="item.coverPic" fit="contain" @click="chooseVedio(item)"/>
<!-- 标题 -->
<div style="text-align: left;">
</div>
<!-- 标题 -->
<div style="text-align: left;">
<el-text>{{ item.fileShowName }}</el-text>
</div>
<!-- 观看人数 -->
@ -71,6 +74,8 @@ const resultTotal = ref(0)
//
const isShow = ref(false)
const curRow = ref({})
// loading
const loading = ref(false)
//
const experimentList = ref([])
@ -94,8 +99,13 @@ const query = ref({
const getData = (data) => {
const { textBook, node } = data
query.value.levelFirstId = node.parentNode.id
query.value.levelSecondId = node.id
if (node.parentNode) {
query.value.levelFirstId = node.parentNode.id
query.value.levelSecondId = node.id
} else {
query.value.levelFirstId = node.id
query.value.levelSecondId = ''
}
query.value.textbookId = node.rootid
getVideoList()
}
@ -106,7 +116,9 @@ const chooseItem = (item) => {
//
const getVideoList = async () => {
loading.value = true
const res = await getSmarttalkPage(query.value)
loading.value = false
experimentList.value = [...res.rows]
resultTotal.value = res.total
}
@ -153,7 +165,7 @@ const chooseVedio = (item) => {
}
.list-content {
border-radius: 8px;
height: 100%;
height: 90%;
}
.list-container {
display: flex;
@ -162,7 +174,7 @@ const chooseVedio = (item) => {
overflow-y: auto;
}
.content-list {
.content {
border-radius: 8px;
// box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
width: calc(20%);
@ -171,10 +183,13 @@ const chooseVedio = (item) => {
padding: 5px
}
.content-list:hover {
.content:hover {
transform: translateY(-4px);
// box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.15);
}
.content-list{
}
.item-content {
display: flex;