mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-11 03:46:44 +08:00
修改
This commit is contained in:
nisen
@@ -14,6 +14,8 @@ const courselList = (data = {}) => ajax.postJson(baseURL, '/xboe/m/boe/course/li
|
||||
const noticeDataById = (id) => ajax.get(baseURL, `/xboe/m/boe/notice/getDataById?id=${id}`);
|
||||
//教师列表
|
||||
const teachersList = (data = {}) => ajax.postJson(baseURL, '/xboe/m/boe/teachers/list', data);
|
||||
//教师列表
|
||||
const carouselList = (data = {}) => ajax.postJson(baseURL, '/xboe/m/boe/rotation/list', data);
|
||||
|
||||
|
||||
|
||||
@@ -25,5 +27,6 @@ export {
|
||||
noticeList,
|
||||
noticeDataById,
|
||||
courselList,
|
||||
teachersList
|
||||
teachersList,
|
||||
carouselList
|
||||
}
|
||||
|
||||
@@ -1,12 +1,8 @@
|
||||
<template>
|
||||
<!--用于显示课程的图片-->
|
||||
<div style="border-radius: 5px;" class="img-box" id="img-box">
|
||||
<el-image
|
||||
style="background-color: #eeeeee;border-radius: 5px;"
|
||||
:style="`width:${width};height:${height};`"
|
||||
fit="fill "
|
||||
:src="imageUrl"
|
||||
>
|
||||
<el-image style="background-color: #eeeeee;border-radius: 5px;" :style="`width:${width};height:${height};`"
|
||||
fit="fill " :src="imageUrl">
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
@@ -47,7 +43,6 @@ export default {
|
||||
default: "100%",
|
||||
},
|
||||
},
|
||||
|
||||
computed: {
|
||||
name() {
|
||||
let name = '';
|
||||
@@ -110,6 +105,8 @@ export default {
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
console.log('hoahaioaiohaiohio');
|
||||
console.log(this.course, '嘿嘿');
|
||||
let obj = document.getElementById("img-box");
|
||||
if ((obj.offsetWidth > 500 || obj.offsetWidth == 500) && obj.offsetWidth < 900) {
|
||||
this.imageTextSize = 3;
|
||||
@@ -130,10 +127,12 @@ export default {
|
||||
<style lang="scss" scoped>
|
||||
.text {
|
||||
text-shadow: 0px 0px 2px #ffffff;
|
||||
|
||||
span {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
}
|
||||
|
||||
.image-slot {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
@@ -141,15 +140,21 @@ export default {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
-moz-user-select: none; /*火狐*/
|
||||
-webkit-user-select: none; /*webkit浏览器*/
|
||||
-ms-user-select: none; /*IE10*/
|
||||
-khtml-user-select: none; /*早期浏览器*/
|
||||
-moz-user-select: none;
|
||||
/*火狐*/
|
||||
-webkit-user-select: none;
|
||||
/*webkit浏览器*/
|
||||
-ms-user-select: none;
|
||||
/*IE10*/
|
||||
-khtml-user-select: none;
|
||||
/*早期浏览器*/
|
||||
user-select: none;
|
||||
|
||||
p {
|
||||
display: -webkit-box;
|
||||
// white-space:pre-wrap;
|
||||
@@ -161,12 +166,17 @@ export default {
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
padding-right: 10px;
|
||||
-moz-user-select: none; /*火狐*/
|
||||
-webkit-user-select: none; /*webkit浏览器*/
|
||||
-ms-user-select: none; /*IE10*/
|
||||
-khtml-user-select: none; /*早期浏览器*/
|
||||
-moz-user-select: none;
|
||||
/*火狐*/
|
||||
-webkit-user-select: none;
|
||||
/*webkit浏览器*/
|
||||
-ms-user-select: none;
|
||||
/*IE10*/
|
||||
-khtml-user-select: none;
|
||||
/*早期浏览器*/
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.mini {
|
||||
top: 30%;
|
||||
left: 8%;
|
||||
@@ -174,6 +184,7 @@ export default {
|
||||
line-height: 24px;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
|
||||
.mid {
|
||||
top: 30%;
|
||||
left: 8%;
|
||||
@@ -181,6 +192,7 @@ export default {
|
||||
line-height: 35px;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
|
||||
.max {
|
||||
top: 30%;
|
||||
left: 8%;
|
||||
@@ -188,6 +200,7 @@ export default {
|
||||
line-height: 40px;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
|
||||
.te-max {
|
||||
top: 30%;
|
||||
left: 8%;
|
||||
@@ -195,5 +208,4 @@ export default {
|
||||
line-height: 35px;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
}</style>
|
||||
|
||||
@@ -1308,6 +1308,8 @@ export default {
|
||||
courseIds.push(item.id);
|
||||
});
|
||||
this.loadCouserTeacher(res.result, courseIds);
|
||||
console.log(res.result,'lalalala');
|
||||
|
||||
this.courseList.list = res.result;
|
||||
//this.couname = res.result.list.name;
|
||||
// if (res.result.count - pageIndex * num < 8) {
|
||||
|
||||
@@ -1,6 +1,34 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 教师赋能 -->
|
||||
<div class="course-banner">
|
||||
<div id="container" style="z-index: 99" v-if="resonimg.length == 1">
|
||||
<!-- 当轮播图等于一张时 -->
|
||||
<swiper :options="swiperOptiontwo">
|
||||
<swiper-slide style="margin: 0 auto" v-for="(item, idx) in resonimg" :key="'a' + idx"
|
||||
class="swiper-slide games pointer">
|
||||
<div class="bannbox" :style="{
|
||||
background: `url(${fileBaseUrl + item.image
|
||||
}) no-repeat 100% / 100%`,
|
||||
}"></div>
|
||||
<img class="banner-img" style="margin: 0 auto" :src="fileBaseUrl + item.image" alt="" />
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</div>
|
||||
<div id="container" style="z-index: 99" v-else>
|
||||
<swiper :options="swiperOption" ref="mySwiper" v-if="resonimg.length > 1">
|
||||
<swiper-slide style="margin: 0 auto" v-for="(item, idx) in resonimg" :key="'b' + idx"
|
||||
class="swiper-slide games pointer">
|
||||
<div class="bannbox" :style="{
|
||||
background: `url(${fileBaseUrl + item.image
|
||||
}) no-repeat 100% / 100%`,
|
||||
}"></div>
|
||||
<img class="banner-img" style="margin: 0 auto" :src="fileBaseUrl + item.image" alt="" />
|
||||
</swiper-slide>
|
||||
<div class="swiper-pagination" slot="pagination"></div>
|
||||
</swiper>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 图片 -->
|
||||
<div class="xindex-content">
|
||||
<div class="modules xcontent2">
|
||||
<div class="xcontent2-main">
|
||||
@@ -157,7 +185,7 @@
|
||||
import apiCourseStudy from "@/api/modules/courseStudy.js";
|
||||
import courseImage from "@/components/Course/courseImage.vue";
|
||||
import { toScore, formatUserNumber } from "@/utils/tools.js";
|
||||
import { saveOpinion, noticeList, courselList, toolList } from '@/api/modules/grateful.js'
|
||||
import { saveOpinion, noticeList, courselList, toolList, carouselList } from '@/api/modules/grateful.js'
|
||||
export default {
|
||||
name: "Grateful",
|
||||
components: {
|
||||
@@ -179,14 +207,56 @@ export default {
|
||||
noticeList: [],
|
||||
toolList: []
|
||||
},
|
||||
resonimg: [],
|
||||
fileBaseUrl: process.env.VUE_APP_FILE_BASE_URL,
|
||||
swiperOptiontwo: {
|
||||
autoplay: false,
|
||||
// noSwiping: true,
|
||||
},
|
||||
resonimg: [],
|
||||
swiperOption: {
|
||||
autoplay: {
|
||||
delay: 2000,
|
||||
disableOnInteraction: false, //解决滑动后不能轮播的问题
|
||||
},
|
||||
speed: 3000, //切换速度，即slider自动滑动开始到结束的时间（单位ms）
|
||||
loop: true, //循环切换
|
||||
peed: 300, //循环速度
|
||||
scrollbar: ".swiper-scrollbar",
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
// type : 'progressbar', //分页器形状
|
||||
clickable: true, //点击分页器的指示点分页器会控制Swiper切换
|
||||
},
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev",
|
||||
},
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.couresreso();
|
||||
this.getCourseData(1);
|
||||
this.getNoticeData()
|
||||
this.getToolData()
|
||||
},
|
||||
methods: {
|
||||
couresreso() {
|
||||
carouselList().then((res) => {
|
||||
console.log(res);
|
||||
const list = res.data.records.map(item => {
|
||||
return {
|
||||
image: item.picPath,
|
||||
name: item.displayPage,
|
||||
JumpUrl: '',
|
||||
bgcolor: '',
|
||||
...item
|
||||
}
|
||||
});
|
||||
this.resonimg = list;
|
||||
})
|
||||
},
|
||||
submitNotice() {
|
||||
if (!this.form.textarea) return this.$message({ message: '请输入内容', type: 'error' })
|
||||
saveOpinion({ content: this.form.textarea }).then(() => {
|
||||
@@ -221,7 +291,13 @@ export default {
|
||||
pageSize: 8
|
||||
}).then((res) => {
|
||||
if (res.code == 200 && res.data.records.length > 0) {
|
||||
console.log(res.result, '之前的');
|
||||
console.log(res.data.records, '之前的');
|
||||
// res.data.records.map((item) => {
|
||||
// return {
|
||||
// ...item,
|
||||
// coverImg:item.coverImg
|
||||
// }
|
||||
// })
|
||||
this.courseList.list = res.data.records;
|
||||
} else {
|
||||
console.log("加载课程信息失败:" + res.error);
|
||||
@@ -251,6 +327,103 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.bannbox {
|
||||
width: 100%;
|
||||
height: 520px;
|
||||
text-align: center;
|
||||
filter: blur(5px);
|
||||
z-index: -1;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
::v-deep.swiper-slide .games .swiper-slide-active {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
#container {
|
||||
position: absolute;
|
||||
height: 520px;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.banner-img {
|
||||
height: 520px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
transform: (-50%, -50%);
|
||||
}
|
||||
|
||||
.course-banner {
|
||||
height: 520px;
|
||||
|
||||
.swiper-button-prev {
|
||||
height: 38px;
|
||||
padding: 0 16px;
|
||||
background: rgba($color: #000000, $alpha: 0.8) url("../../assets/images/icon/ban-left.png") no-repeat;
|
||||
background-size: 12px 18px;
|
||||
background-position: 16px 10px;
|
||||
bottom: 66px;
|
||||
border-radius: 19px 0 0 19px;
|
||||
}
|
||||
|
||||
.swiper-button-next {
|
||||
height: 38px;
|
||||
bottom: 66px;
|
||||
top: auto;
|
||||
padding: 0 16px;
|
||||
background: rgba($color: #000000, $alpha: 0.1) url("../../assets/images/icon/ban-right.png") no-repeat;
|
||||
background-size: 12px 18px;
|
||||
background-position: 6px 10px;
|
||||
border-radius: 0 19px 19px 0;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullets {
|
||||
left: 60px;
|
||||
bottom: 66px;
|
||||
}
|
||||
|
||||
::v-deep .swiper-pagination {
|
||||
line-height: 25px;
|
||||
height: 32px;
|
||||
border-radius: 19px;
|
||||
width: auto;
|
||||
left: 45%;
|
||||
padding: 0 20px;
|
||||
border-radius: 19px;
|
||||
|
||||
.swiper-pagination-bullet {
|
||||
position: relative;
|
||||
width: 25px;
|
||||
height: 5px;
|
||||
margin-top: 10px;
|
||||
background: #fff;
|
||||
opacity: 1 !important;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
bottom: -20px;
|
||||
left: -2px;
|
||||
right: -2px;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet-active {
|
||||
height: 5px;
|
||||
opacity: 1 !important;
|
||||
margin-top: 10px;
|
||||
width: 25px;
|
||||
background: #387df7;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__body {
|
||||
background: linear-gradient(180deg, rgba(56, 125, 247, 0.2) 0%, rgba(166, 168, 255, 0) 100%) no-repeat;
|
||||
background-size: 100% 136px;
|
||||
|
||||
@@ -31,6 +31,12 @@
|
||||
</pagination>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="list.length == 0" class="pagination-div">
|
||||
<span class="notcoures">
|
||||
<img :src="`${webBaseUrl}/images/nocase.png`" alt="">
|
||||
<h5>暂无数据～</h5>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -122,6 +128,11 @@ export default {
|
||||
background: #ffffff;
|
||||
border-radius: 8px;
|
||||
|
||||
.pagination-div {
|
||||
text-align: center;
|
||||
padding: 70px 0;
|
||||
}
|
||||
|
||||
.bgc {
|
||||
background: linear-gradient(180deg,
|
||||
rgba(56, 125, 247, 0.2) 0%,
|
||||
|
||||
@@ -32,9 +32,8 @@
|
||||
<course-image :course="course"></course-image>
|
||||
<span v-if="course.type == 20 || 10" class="course-type">录播课</span>
|
||||
</div>
|
||||
<div style="width: 80%" :title="course.name" class="course-title portal-title-tow two-line-ellipsis">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div style="width: 80%" :title="course.name" v-html="course.name"
|
||||
class="course-title portal-title-tow two-line-ellipsis"></div>
|
||||
<div class="course-author">
|
||||
<div class="course-author-left">
|
||||
{{ course.createName }}
|
||||
@@ -51,10 +50,16 @@
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="list.length == 0" class="pagination-div">
|
||||
<span class="notcoures">
|
||||
<img :src="`${webBaseUrl}/images/nocase.png`" alt="">
|
||||
<h5>暂无数据～</h5>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<div v-if="list.length !== 0">
|
||||
<pagination :size="param.pageSize" :total="total" :page="param.pageNo" @change-size="changePageSize"
|
||||
@change-page="loadData" style="background-color: rgba(0, 0, 0, 0);" :autoScroll="false"
|
||||
:pageSizes="[12, 24, 36, 48]"></pagination>
|
||||
@@ -125,10 +130,22 @@ export default {
|
||||
//return $this.webBaseUrl + "/course/detail?id=" + item.id;
|
||||
}
|
||||
},
|
||||
//高亮
|
||||
brightenKeyword(val, keyword) {
|
||||
const Reg = new RegExp(keyword, 'i');
|
||||
let res = '';
|
||||
if (val) {
|
||||
res = val.replace(Reg, `<span style="color: #3e7fff;">${keyword}</span>`);
|
||||
return res;
|
||||
}
|
||||
},
|
||||
getCourseData() {
|
||||
courselList(this.param).then((res) => {
|
||||
if (res.code == 200 && res.data.records.length > 0) {
|
||||
console.log(res.data, '之前的');
|
||||
res.data.records.forEach(item => {
|
||||
item.name = this.brightenKeyword(item.name, this.param.name);
|
||||
});
|
||||
this.list = res.data.records;
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
@@ -249,6 +266,11 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.pagination-div {
|
||||
text-align: center;
|
||||
padding: 70px 0;
|
||||
}
|
||||
|
||||
.modules-list {
|
||||
margin-top: 30px;
|
||||
|
||||
|
||||
@@ -37,6 +37,12 @@
|
||||
:page="params.pageNo" @change-size="changePageSize" @change-page="loadData" :autoScroll="false">
|
||||
</pagination>
|
||||
</div>
|
||||
<div v-if="list.length == 0" class="pagination-div">
|
||||
<span class="notcoures">
|
||||
<img :src="`${webBaseUrl}/images/nocase.png`" alt="">
|
||||
<h5>暂无数据～</h5>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -145,8 +151,20 @@ export default {
|
||||
rgba(166, 168, 255, 0) 100%) no-repeat;
|
||||
background-size: 100% 166px;
|
||||
border-radius: 8px;
|
||||
|
||||
.pagination-div {
|
||||
text-align: center;
|
||||
padding: 70px 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.pagination-div {
|
||||
text-align: center;
|
||||
padding: 70px 0;
|
||||
}
|
||||
|
||||
|
||||
.sear-but {
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
|
||||
@@ -1,33 +1,5 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="course-banner" v-if="!$route.meta.hidden">
|
||||
<div id="container" style="z-index: 99" v-if="resonimg.length == 1">
|
||||
<!-- 当轮播图等于一张时 -->
|
||||
<swiper :options="swiperOptiontwo">
|
||||
<swiper-slide style="margin: 0 auto" v-for="(item, idx) in resonimg" :key="'a' + idx"
|
||||
class="swiper-slide games pointer">
|
||||
<div class="bannbox" :style="{
|
||||
background: `url(${fileBaseUrl + item.image
|
||||
}) no-repeat 100% / 100%`,
|
||||
}"></div>
|
||||
<img class="banner-img" style="margin: 0 auto" :src="fileBaseUrl + item.image" alt="" />
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</div>
|
||||
<div id="container" style="z-index: 99" v-else>
|
||||
<swiper :options="swiperOption" ref="mySwiper" v-if="resonimg.length > 1">
|
||||
<swiper-slide style="margin: 0 auto" v-for="(item, idx) in resonimg" :key="'b' + idx"
|
||||
class="swiper-slide games pointer">
|
||||
<div class="bannbox" :style="{
|
||||
background: `url(${fileBaseUrl + item.image
|
||||
}) no-repeat 100% / 100%`,
|
||||
}"></div>
|
||||
<img class="banner-img" style="margin: 0 auto" :src="fileBaseUrl + item.image" alt="" />
|
||||
</swiper-slide>
|
||||
<div class="swiper-pagination" slot="pagination"></div>
|
||||
</swiper>
|
||||
</div>
|
||||
</div>
|
||||
<router-view></router-view>
|
||||
<!-- 底部 -->
|
||||
<div class="grateful">
|
||||
@@ -37,50 +9,12 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import apiPlace from "@/api/phase2/place.js";
|
||||
export default {
|
||||
name: "Grateful",
|
||||
data() {
|
||||
return {
|
||||
resonimg: [],
|
||||
swiperOptiontwo: {
|
||||
autoplay: false,
|
||||
// noSwiping: true,
|
||||
},
|
||||
swiperOption: {
|
||||
autoplay: {
|
||||
delay: 2000,
|
||||
disableOnInteraction: false, //解决滑动后不能轮播的问题
|
||||
},
|
||||
speed: 3000, //切换速度，即slider自动滑动开始到结束的时间（单位ms）
|
||||
loop: true, //循环切换
|
||||
peed: 300, //循环速度
|
||||
scrollbar: ".swiper-scrollbar",
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
// type : 'progressbar', //分页器形状
|
||||
clickable: true, //点击分页器的指示点分页器会控制Swiper切换
|
||||
},
|
||||
navigation: {
|
||||
nextEl: ".swiper-button-next",
|
||||
prevEl: ".swiper-button-prev",
|
||||
},
|
||||
},
|
||||
fileBaseUrl: process.env.VUE_APP_FILE_BASE_URL,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.couresreso();
|
||||
},
|
||||
methods: {
|
||||
couresreso() {
|
||||
let key = "index";
|
||||
apiPlace.detail(key).then((res) => {
|
||||
let lmj = JSON.parse(res.result.content);
|
||||
this.resonimg = lmj;
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -123,101 +57,4 @@ export default {
|
||||
|
||||
|
||||
}
|
||||
|
||||
.bannbox {
|
||||
width: 100%;
|
||||
height: 520px;
|
||||
text-align: center;
|
||||
filter: blur(5px);
|
||||
z-index: -1;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
::v-deep.swiper-slide .games .swiper-slide-active {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
#container {
|
||||
position: absolute;
|
||||
height: 520px;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.banner-img {
|
||||
height: 520px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
transform: (-50%, -50%);
|
||||
}
|
||||
|
||||
.course-banner {
|
||||
height: 520px;
|
||||
|
||||
.swiper-button-prev {
|
||||
height: 38px;
|
||||
padding: 0 16px;
|
||||
background: rgba($color: #000000, $alpha: 0.8) url("../../assets/images/icon/ban-left.png") no-repeat;
|
||||
background-size: 12px 18px;
|
||||
background-position: 16px 10px;
|
||||
bottom: 66px;
|
||||
border-radius: 19px 0 0 19px;
|
||||
}
|
||||
|
||||
.swiper-button-next {
|
||||
height: 38px;
|
||||
bottom: 66px;
|
||||
top: auto;
|
||||
padding: 0 16px;
|
||||
background: rgba($color: #000000, $alpha: 0.1) url("../../assets/images/icon/ban-right.png") no-repeat;
|
||||
background-size: 12px 18px;
|
||||
background-position: 6px 10px;
|
||||
border-radius: 0 19px 19px 0;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullets {
|
||||
left: 60px;
|
||||
bottom: 66px;
|
||||
}
|
||||
|
||||
::v-deep .swiper-pagination {
|
||||
line-height: 25px;
|
||||
height: 32px;
|
||||
border-radius: 19px;
|
||||
width: auto;
|
||||
left: 45%;
|
||||
padding: 0 20px;
|
||||
border-radius: 19px;
|
||||
|
||||
.swiper-pagination-bullet {
|
||||
position: relative;
|
||||
width: 25px;
|
||||
height: 5px;
|
||||
margin-top: 10px;
|
||||
background: #fff;
|
||||
opacity: 1 !important;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -20px;
|
||||
bottom: -20px;
|
||||
left: -2px;
|
||||
right: -2px;
|
||||
}
|
||||
|
||||
.swiper-pagination-bullet-active {
|
||||
height: 5px;
|
||||
opacity: 1 !important;
|
||||
margin-top: 10px;
|
||||
width: 25px;
|
||||
background: #387df7;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div id="couser-list-content" class="couser-list-content">
|
||||
<div class="course-banner">
|
||||
<portal-header current="course" textColor="#fff" :keywords="keyword" @emitInput="emitInput" @showClass="showClass"></portal-header>
|
||||
<portal-header current="course" textColor="#fff" :keywords="keyword" @emitInput="emitInput"
|
||||
@showClass="showClass"></portal-header>
|
||||
</div>
|
||||
<div style="padding-top:30px">
|
||||
<div class="xcontent2">
|
||||
@@ -394,7 +395,7 @@
|
||||
</template>
|
||||
<!-- 线上品牌系列课程 -->
|
||||
<template v-if="newData">
|
||||
<div class="xcourse-card" style="margin-bottom: 0;margin-top: 36px;" v-for="(cinfo, cidx) in courseList" :key="cinfo.id">
|
||||
<div class="xcourse-card" v-for="cinfo in courseList" :key="cinfo.id" style="margin-bottom: 0;margin-top: 36px;">
|
||||
<div class="course-card" style="padding: 10px;">
|
||||
<a @click="() => $message.success('如需了解详情，请联系BOEU')">
|
||||
<div class="course-img-box">
|
||||
@@ -1556,6 +1557,7 @@ export default {
|
||||
.couser-list-content {
|
||||
min-height: 110%;
|
||||
}
|
||||
|
||||
// 标题
|
||||
.navTitle {
|
||||
margin-bottom: 20px;
|
||||
@@ -2388,5 +2390,4 @@ export default {
|
||||
|
||||
.option-active {
|
||||
color: #387DF7;
|
||||
}
|
||||
</style>
|
||||
}</style>
|
||||
|
||||
Reference in New Issue
Block a user