Merge branch 'master_1030' into 'master'

Master 1030

See merge request !62
This commit is contained in:
joshen
2023-10-30 20:16:33 +08:00
19 changed files with 1189 additions and 74 deletions

33
.gitignore vendored
View File

@@ -1 +1,32 @@
/node_modules
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
fe-manage.iml
package-lock.json
src/api/config.js
src/api/config.js
src/api/config.js
src/api/config.js
fe-manage-develop.iml
yarn.lock

Binary file not shown.

After

Width:  |  Height:  |  Size: 222 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 442 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 693 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 751 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 598 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 679 B

View File

@@ -1,4 +1,6 @@
import ajax from '@/utils/xajax.js'
import http from '../unionAjax'
const baseURL = process.env.VUE_APP_MANAGER_API_PATH;
/**
@@ -45,6 +47,12 @@ const articlelist=function (type){
const courselist=function (data){
return ajax.post('/xboe/portal/index/courselist',data);
}
/**
* 首页新课程推荐列表
*/
const getRecommendList=function (pageNum,pageSize){
return http.get(baseURL,`/recommend/studentPage?pageNum=${pageNum}&pageSize=${pageSize}`);
}
export default {
cases,
@@ -52,5 +60,6 @@ export default {
qaAnswers,
articlelist,
courselist,
newCases
newCases,
getRecommendList
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

View File

@@ -509,11 +509,17 @@
}
}
}
.reviewTop{
margin-top: 20px;
}
.xindex-ranking-li{
margin-top:15px;
}
.xindex-ranking-review{
height: 186px;
}
.xindex-ranking-course{
height: 465px;
height: 452px;
}
.xindex-ranking-case{
@@ -777,8 +783,14 @@
.xindex-ranking-li{
margin-top:20px;
}
.reviewTop{
margin-top: 20px;
}
.xindex-ranking-review{
height: 204px;
}
.xindex-ranking-course{
height: 509px;
height: 508px;
}
.xindex-ranking-case{
@@ -1059,8 +1071,14 @@
.xindex-ranking-li{
margin-top:30px;
}
.reviewTop{
margin-top: 30px;
}
.xindex-ranking-review{
height: 249px;
}
.xindex-ranking-course{
height: 592px;
height: 598px;
}
.xindex-ranking-case{
@@ -1324,8 +1342,14 @@
.xindex-ranking-li{
margin-top:30px;
}
.reviewTop{
margin-top: 36px;
}
.xindex-ranking-review{
height: 272px;
}
.xindex-ranking-course{
height: 614px;
height: 650px;
}
.xindex-ranking-case{

View File

@@ -110,6 +110,20 @@ export const constantRoutes = [{
name: 'course',
meta: { title: '课程', keepAlive: true, icon: 'dashboard', noCache: true, affix: false },
},
{
path: '/courseRecommended',
hidden: true,
component: (resolve) => require(['@/views/portal/course/CourseRecommended'], resolve),
name: 'courseRecommended',
meta: { title: '推荐课程', keepAlive: true, icon: 'dashboard', noCache: true, affix: false },
},
{
path: '/courseSeries',
hidden: true,
component: (resolve) => require(['@/views/portal/course/CourseSeries'], resolve),
name: 'courseSeries',
meta: { title: '系列课程', keepAlive: true, icon: 'dashboard', noCache: true, affix: false },
},
{
path: '/course/micro',
hidden: true,

View File

@@ -17,15 +17,15 @@ const mutations={
const actions={
getSysTypeTree({commit}) {
return new Promise((resolve,reject)=>{
if(state.sysTypeTree.length>0){
resolve(state.sysTypeTree);
}else{
let hasData = sessionStorage.getItem('sysTypeTree');
if(hasData){
let treeData = JSON.parse(hasData);
commit('setSysTypeTree', treeData);
resolve(treeData);
}else{
// if(state.sysTypeTree.length>0){
// resolve(state.sysTypeTree);
// }else{
// let hasData = sessionStorage.getItem('sysTypeTree');
// if(hasData){
// let treeData = JSON.parse(hasData);
// commit('setSysTypeTree', treeData);
// resolve(treeData);
// }else{
apiType.tree(1).then(res=>{
if(res.status === 200) {
sessionStorage.setItem('sysTypeTree',JSON.stringify(res.result));
@@ -51,8 +51,8 @@ const mutations={
reject('资源归属获取失败!');
}
})
}
}
// }
// }
});
},
loadSysTypes(context){

View File

@@ -211,7 +211,7 @@
</div> -->
<!--内容列表内容-->
<div
v-for="(course, ccidx) in courseList.list"
v-for="(course, ccidx) in courseComputedOneList"
:key="'cc' + ccidx"
class="xindex-course"
style="position: relative"
@@ -263,12 +263,118 @@
</div>
</a>
</div>
<!-- 推荐课程内容列表 -->
<div
v-for="(course, ccidx) in recommendedList.list"
:key="'rr' + ccidx"
class="xindex-course"
style="position: relative"
>
<div style="position: absolute; right: 25px; bottom: 72px">
<interactBar
nodeWidth="20px"
:courseExclusive="true"
:type="1"
:data="course"
:comments="false"
:praises="false"
:shares="false"
:views="false"
>
</interactBar>
</div>
<a @click="toCourseDetail(course)">
<div class="xindex-course-image">
<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 class="course-author">
<div class="course-author-left">
{{ course.authorInfo.name }}
<span class="study-num"
>{{ formatNum(course.studys) }}人学习</span
>
</div>
<div style="display: flex">
<div v-if="course.score">
<span class="course-score-value" style="margin-left: 10px"
>{{ toScore(course.score) }}</span
>
</div>
<div v-else class="course-score-no">未评分</div>
</div>
</div>
</a>
</div>
<!--内容列表内容-->
<div
v-for="(course, ccidx) in courseComputedTwoList"
:key="'cctwo' + ccidx"
class="xindex-course"
style="position: relative"
>
<div style="position: absolute; right: 25px; bottom: 72px">
<interactBar
nodeWidth="20px"
:courseExclusive="true"
:type="1"
:data="course"
:comments="false"
:praises="false"
:shares="false"
:views="false"
>
</interactBar>
<!-- <svg-icon style="font-size: 32px;margin-top: -5px;" icon-class="collectedCourse"></svg-icon> -->
</div>
<a @click="toCourseDetail(course)">
<div class="xindex-course-image">
<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 class="course-author">
<div class="course-author-left">
{{ course.authorInfo.name }}
<span class="study-num"
>{{ formatNum(course.studys) }}人学习</span
>
</div>
<div style="display: flex">
<div v-if="course.score">
<span class="course-score-value" style="margin-left: 10px"
>{{ toScore(course.score) }}</span
>
</div>
<div v-else class="course-score-no">未评分</div>
</div>
</div>
</a>
</div>
</div>
</div>
<div class="xcontent2-minor" style="margin-top: 60px">
<div class="portal-ranking ranking-bg">
<p class="ranking-title">课程排行</p>
<p class="ranking-title">课程热度</p>
<ul class="xindex-ranking-course">
<li
class="xindex-ranking-li"
@@ -317,6 +423,27 @@
</li>
</ul>
</div>
<div class="portal-ranking ranking-bg reviewTop">
<p class="ranking-title">课程好评榜</p>
<ul class="xindex-ranking-review" style="overflow: auto;margin: 0;top: 0;">
<li
@click="jumcasedet(item)"
class="xindex-ranking-li title-line-ellipsis"
v-for="(item, index) in Positive"
:key="'bb' + index"
style="line-height: 22px"
>
<span class="portal-right-text orange-one">
<img :src="getPic(index)" alt="" />
</span>
<span
class="portal-title-desc index-one-line-ellipsis title-line-ellipsis"
style="font-size: 14px; color: #04243c; line-height: 26px"
>{{ item.title }}</span
>
</li>
</ul>
</div>
</div>
</div>
<!-- 推荐案例2版 -->
@@ -947,6 +1074,7 @@ export default {
},
data() {
return {
Positive:[],
showUClass: false,
showLoginMedal: false, //是否显示登录勋章
needLoginMedal: false, //是否需要显示纪念勋章
@@ -968,6 +1096,7 @@ export default {
ankingList: [],
answersList: [],
Popularity: [],
reviewList:[],//好评
scorelist: [],
resonimg: [],
swiperOptiontwo: {
@@ -1004,6 +1133,10 @@ export default {
orderType: 2,
list: [],
},
// 推荐课程
recommendedList:{
list: [],
},
caseList: {
num: 3,
orderType: 2,
@@ -1027,6 +1160,8 @@ export default {
},
mounted() {
this.getCourseData(1);
this.getRecommendList();
this.getPositive()
this.getCaseData();
this.getArticleData();
this.getQaData();
@@ -1082,8 +1217,22 @@ export default {
swiper() {
return this.$refs.mySwiper.swiper;
},
courseComputedOneList(){
return this.courseList.list.slice(0,3)
},
courseComputedTwoList(){
return this.courseList.list.slice(3)
},
},
methods: {
getPositive() {
apiCase.queryComments(10).then(res => {
if (res.status == 200) {
this.Positive = res.result;
console.log(res);
}
});
},
tylClick() {
window.open("https://m.qingxuetang.com/x/?appId=qxtcorp306130");
},
@@ -1280,6 +1429,29 @@ export default {
if (this.isNext) {
this.getCourseData(this.pageIndex);
}
},
// 获取推荐课程list
getRecommendList(){
apiIndex.getRecommendList(1,3).then((res) => {
if(res.code === 200){
console.log(res.data.records);
let courseIds = [];
res.data.records.forEach((item) => {
item.authorInfo = {
aid: "",
name: "",
orgInfo: "",
avatar: "",
code: "",
sex: null,
};
courseIds.push(item.id);
});
this.loadCouserTeacher(res.data.records, courseIds);
console.log(res.result,'lalalala');
this.recommendedList.list = res.data.records
}
})
},
getCourseData(pageIndex) {
this.isNext = false;

View File

@@ -404,6 +404,7 @@ export default {
this.getResOwnerTree().then(rs=>{
this.resOwnerListMap=rs;
});
// 取消全局课程分类
this.getSysTypeTree().then(rs=>{
this.sysTypeListMap=rs;
})

View File

@@ -4,6 +4,43 @@
<portal-header current="case" textColor="#fff" @emitInput="emitInput" @showClass="showClass"></portal-header>
</div>
<div class="xcontent2">
<!-- 新增的案例分类 -->
<!-- <div class="xcontent2-minor" style="margin-right:36px;">
<div class="course-title-style">
<div class="imgTilte">
<div>案例分类</div>
<div>COURSE</div>
</div>
</div>
<div class="course-list">
<div class="course-one" v-for="one in treeList" :key="one.id" @click.stop="handleOptionClick(one, 1, treeList)">
<div class="course-one-content">{{ one.name }}</div>
<div class="course-two" v-for="(twoList, twoIndex) in one.children" :key="twoList.id"
@click.stop="handleOptionClick(twoList, 2, one.children)"
:class="{ courseTwoActive: twoList.id == twoId || twoList.checked }" @mouseleave.stop="leaveIndex"
@mouseenter.stop="changeIndex(twoList.id)"
>
<el-popover class="popover" popper-class='coursePopperClass' placement="right-start" width="536"
:disabled="!twoList.children.length" :open-delay="0" :close-delay="0" trigger="hover" :visible-arrow="false"
@hide="leaveIndex" @show="changeIndex(twoList.id)" transition="none">
<div class="course-two-content" slot="reference">{{ twoList.name }}</div>
<div class="course-three-box">
<div class="course-three-box-title">
{{ twoList.name }}
</div>
<div style="padding: 0 40px;display: flex;flex-wrap: wrap;">
<div :class="threeList.checked ? 'threeActive' : ''" v-for="threeList in twoList.children"
:key="threeList.id" @click.stop="handleOptionClick(threeList, 3, twoList.children)"
class="course-three">
<span>{{ threeList.name }}</span>
</div>
</div>
</div>
</el-popover>
</div>
</div>
</div>
</div> -->
<div class="xcontent2-main" style="margin-right: 30px;">
<div class="left-div">
<div class="search-div">
@@ -211,6 +248,7 @@
</div>
</div>
<!-- 打开排行榜 -->
<div class="xcontent2-minor">
<div id="fixd-box">
<div class="portal-ranking ranking-bg">
@@ -265,10 +303,6 @@
</li>
</ul>
</div>
<!-- <div class="course-resources pointer"> -->
<!-- 资源位 -->
<!-- <img @click="banJump()" :src="fileBaseUrl + resonimg.image" alt=""> -->
<!-- </div> -->
</div>
</div>
<div style="height: 50px;"></div>
@@ -361,6 +395,8 @@ export default {
},
data() {
return {
twoId:'',
treeList:[],
caseType:process.env.VUE_APP_CASE_TYPE,//类型
caseYears:[],
refId: '',//消息跳转案例的id
@@ -413,6 +449,9 @@ export default {
notInIds: [],//重复的id
orderField: "id",
orderAsc: false,//排序
sysType1:'',
sysType2:'',
sysType3:''
},
keyWord: "",
anking: 2,
@@ -478,6 +517,29 @@ export default {
list.push(item);
}
});
this.treeList.forEach(one => {
var twoChildChecked = false;//是否有下级
one.children && one.children.forEach(two => {
if (two.checked) {
twoChildChecked = true;
}
var threeChildChecked = false;
two.children && two.children.forEach(three => {
if (three.checked) {
list.push(three);
threeChildChecked = true;
}
});
if (two.checked && !threeChildChecked) {
list.push(two);
}
});
if (one.checked && !twoChildChecked) {
list.push(one);
}
})
console.log(list,'计算属性');
return list;
},
oneTagAll() {
@@ -626,9 +688,11 @@ export default {
if (this.refId) {
this.queryCondition.type = 'recommend'
}
this.loadTypeData();//加载分类
this.getAnkingData();
this.getPopularity();
this.searchterm();
//打开排行榜下边的两个
this.getPopularity();
this.getPositive();
this.couresreso();
// window.addEventListener("scroll", this.handleScroll);
@@ -642,6 +706,67 @@ export default {
},
methods: {
handleOptionClick(treeItem){
this.treeList.forEach(one => {
one.checked = false;
if (one.id == treeItem.id) {
one.checked = true;
this.queryCondition.sysType2 = ''
this.queryCondition.sysType3 = ''
this.queryCondition.sysType1 = one.id
}
one.children.forEach(two => {
two.checked = false;
if (two.id == treeItem.id) {
two.checked = true
this.queryCondition.sysType1 = ''
this.queryCondition.sysType3 = ''
this.queryCondition.sysType2 = two.id
}
two.children.forEach(three => {
three.checked = false;
if (three.id == treeItem.id) {
three.checked = true
this.queryCondition.sysType1 = ''
this.queryCondition.sysType2 = ''
this.queryCondition.sysType3 = three.id
}
})
})
})
this.getCaseData()
},
// 移入
changeIndex(twoId) {
this.twoId = twoId
},
// 移除
leaveIndex() {
this.twoId = ''
},
// 加载分类
async loadTypeData() {
try {
const { result, status } = await apiType.tree(1);
if (status === 200) {
result.forEach(one => {
one.checked = false;
if(!one.children) one.children = []
one.children && one.children.forEach(two => {
two.checked = false;
if(!two.children) two.children = []
two.children && two.children.forEach(three => {
three.checked = false;
if(!three.children) three.children = []
})
})
})
this.treeList = result
}
} catch (error) {
console.log(error);
}
},
getYears() {
apiCase.caseYears().then(res => {
if (res.status == 200) {
@@ -1232,7 +1357,16 @@ export default {
// }
// },
tagsClose(tag, index) {
tag.fielclass = false;
// 课程分类
if(tag.hasOwnProperty('checked')){
tag.checked = false;
this.queryCondition.sysType1 =''
this.queryCondition.sysType2 =''
this.queryCondition.sysType3 =''
}else{
// 案例分类
tag.fielclass = false;
}
if (tag.type == 0) {
this.keyWord = '';
}
@@ -1334,6 +1468,77 @@ export default {
</script>
<style scoped lang="scss">
// 课程分类
.course-title-style {
position: relative;
height: 100px;
background-image: url('../../../../public/images/courseBg.png');
background-repeat: no-repeat;
background-size: 100% 100%;
display: flex;
align-items: center;
.imgTilte {
& div:first-child {
padding-left: 40px;
font-size: 30px;
color: #FFFFFF;
}
& div:last-child {
padding-left: 40px;
font-size: 20px;
color: #FFFFFF;
opacity: .5;
font-family: ArialMT !important;
}
}
}
// 三级列表
.course-list {
background-color: #fff;
.course-one {
position: relative;
.course-one-content {
cursor: pointer;
line-height: 38px;
height: 38px;
padding-left: 40px;
background: linear-gradient(270deg, #F0F7FF 0%, #DDEDFF 100%);
}
// 二级的高亮
.courseTwoActive {
color: #387DF7;
border-image: linear-gradient(90deg, rgba(47, 101, 236, 1), rgba(228, 236, 255, 1)) 1 1 !important;
}
.course-two {
position: relative;
border-bottom: 1px solid;
border-image: linear-gradient(333deg, rgba(243, 243, 243, 1), rgba(227, 227, 227, 1)) 1 1;
.course-two-content {
cursor: pointer;
height: 38px;
line-height: 38px;
font-size: 16px;
padding-left: 40px;
}
}
.popover {
background: linear-gradient(180deg, rgba(78, 166, 255, 0.2) 0%, rgba(78, 166, 255, 0) 100%);
}
}
}
.u-class {
::v-deep .el-dialog {
border-radius: 15px;

View File

@@ -0,0 +1,348 @@
<template>
<div id="couser-list-content">
<div class="case-banner">
<PortalHeader current="course" textColor="#fff" :keywords="keyword" @emitInput="emitInput" @showClass="showClass" />
</div>
<!-- 搜索和nav -->
<div class="xcontent2">
<div class="xcontent2-main">
<div class="left-div">
<div class="navTitle">
<diV>
<template v-if="navTitle.length">
<div class="oneTitle" v-for="(item, index) in navTitle" :key="item.id">
<router-link :to="item.path" class="titleName">&nbsp;{{
item.name
}}&nbsp;</router-link>
<span v-if="index !== navTitle.length - 1">></span>
</div>
</template>
</diV>
<div style="position: relative;">
<el-input class="portal-input" placeholder="请输入课程名称" style="border-radius: 20px !important; "
@keyup.enter.native="searchJump()" clearable maxlength="50" v-model="params.courseName">
</el-input>
<el-button class="sear-but" @click="searchJump()" type="primary" size="mini">搜索</el-button>
</div>
</div>
</div>
</div>
</div>
<!-- 中心 -->
<div v-for="item in courseList.list" :key="item.id" style="margin-bottom: 30px;" class="xcontent2">
<div class="xcontent2-main">
<div class="left-div">
<div class="data-content">
<div class="case-list" style="margin-top: 25px;" @click="handleClick(item.id)">
<div class="imgEntrance">
<img src="../../../assets//images/grateful/empBanner.png" alt="">
</div>
<div class="courseTitle" :data-type="item.id">
<div class="courseTop">
<div class="case-tittext">
<span class="title-line-ellipsis">{{ item.title }}</span>
</div>
<div class="case-info-date portal-time">
<i class="el-icon-time"></i>
<TimeShow :time="item.sysCreateTime" />
</div>
</div>
<div class="courseInfoSummary two-line-ellipsis">
{{ item.summary }}
</div>
<div class="recommendedAuthor">
<div>京东方大学推荐</div>
<div>共3门课程</div>
</div>
</div>
</div>
<div v-if="courseList.showPagCount > params.pageSize">
<pagination :size="params.pageSize" :total="courseList.count" :page="params.pageNo"
layout="total, prev, pager, next, jumper" @change-page="currentChange"></pagination>
</div>
</div>
</div>
</div>
</div>
<!-- 评分 -->
<div class="float-tools" @click="() => (evaluateVisible = !evaluateVisible)">
<div class="content">
<img src="../../../assets/images/grateful/suggestion.png" alt="" />
<span>去评分</span>
</div>
</div>
<!-- 意见 -->
<el-dialog :close-on-click-modal="false" width="629px" :visible.sync="evaluateVisible" :append-to-body="true"
@closed="closeDlg">
<div class="dialogContent">
<div class="dialogTop">
<div class="words">
<div>我对本次推荐课程很满意</div>
</div>
</div>
<el-form>
<el-form-item>
<div class="scoreList">
<div class="scoreEvery" :class="mark == index ? 'scoreActive' : ''" v-for="item, index in 10" :key="index"
@click="score(index)">
{{ item }}
</div>
</div>
</el-form-item>
<el-form-item>
<div style="display: flex; justify-content: center">
<el-button style="width: 100px;" @click="closeDlg">取消</el-button>
<el-button style="width: 100px;" @click="submitNotice" type="primary">确认</el-button>
</div>
</el-form-item>
</el-form>
</div>
</el-dialog>
</div>
</template>
<script>
import PortalHeader from "@/components/PortalHeader.vue";
import TimeShow from "@/components/Portal/datetimeShow.vue";
export default {
name: 'CourseRecommended',
components: { PortalHeader, TimeShow },
data() {
return {
evaluateVisible: false,
mark: -1,
keyword: "",
navTitle: [{
name: "课程",
path: '/course'
}, {
name: "推荐课程",
path: ''
}],
params: {
pageNo: 1,
pageSize: 10,
courseName: '',
},
courseList: {
list: [{
id: 1,
title: "项目管理系列课程",
sysCreateTime: '2023-09-22',
summary: "哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊红i哈好哈啊哈好哈啊哈哈好哈哈啊哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊哈哈好哈哈啊"
}, {
id: 2,
title: "项目管理系列课程",
sysCreateTime: '2023-09-22',
summary: "哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊红i哈好哈啊哈好哈啊哈哈好哈哈啊哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊哈哈好哈哈啊"
}, {
id: 3,
title: "项目管理系列课程",
sysCreateTime: '2023-09-22',
summary: "哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊红i哈好哈啊哈好哈啊哈哈好哈哈啊哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊哈哈好哈哈啊"
}],
showPagCount: 0,
count: 0
}
}
},
computed: {
queryId() {
console.log(this.$route.query);
return this.$route.query.id
}
},
mounted() {
},
methods: {
score(mark) {
this.mark = mark
},
closeDlg() {
this.mark = -1
this.evaluateVisible = false
},
submitNotice() {
},
emitInput() {
},
showClass() { },
// 点击跳转到链接
handleClick(id) {
this.$router.push({
path: '/courseSeries',
query: { id }
})
}
}
};
</script>
<style scoped lang="scss">
.case-banner {
height: 240px;
background: url('../../../../public/images/courseBanner.png');
margin-bottom: 30px;
}
/* 标题 */
.navTitle {
margin-bottom: 20px;
display: flex;
justify-content: space-between;
align-items: center;
& a:hover {
color: #387DF7;
}
.oneTitle {
display: inline-block;
cursor: pointer;
& .titleName:hover {
color: #387DF7;
}
}
.sear-but {
position: absolute;
bottom: 10%;
right: 5px;
}
}
// 中心内容
.data-content {
background-color: #fff;
padding: 5px 50px;
cursor: pointer;
.case-list {
margin-top: 10px;
margin-bottom: 25px;
padding-left: 5px;
padding-right: 5px;
display: flex;
.imgEntrance {
width: 350px;
height: 196px;
img {
width: 100%;
height: 100%;
}
margin-right: 20px;
}
.courseTitle {
padding-top: 30px;
flex: 1;
.courseTop {
display: flex;
justify-content: space-between;
.case-tittext {
font-size: 18px;
color: #00253E;
}
}
.courseInfoSummary {
margin-top: 16px;
cursor: pointer;
margin-bottom: 5px;
word-break: break-all;
line-height: 24px;
font-size: 14px;
color: #333330;
font-weight: 400;
color: #6E7B84;
}
.recommendedAuthor {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 40px;
color: #6E7B84;
font-size: 14px;
}
}
}
}
.float-tools {
position: fixed;
right: 0;
bottom: 40%;
z-index: 999;
cursor: pointer;
.content {
width: 152px;
height: 55px;
display: flex;
align-items: center;
background: linear-gradient(86deg, #00c8ff 0%, #167cff 100%);
border-radius: 100px 0px 0px 100px;
padding: 20px;
img {
width: 20px;
height: 20px;
}
span {
margin-left: 10px;
color: #fff;
font-size: 20px;
}
}
}
.dialogContent {
.dialogTop {
display: flex;
justify-content: space-between;
margin-bottom: 40px;
.words {
font-size: 26px;
font-weight: 600;
color: #333333;
line-height: 37px;
}
}
.scoreList {
display: flex;
justify-content: space-between;
align-items: center;
.scoreEvery {
cursor: pointer;
width: 50px;
height: 50px;
line-height: 50px;
background: #F1F2F4;
border-radius: 8px;
border: 1px solid #D4D4D4;
text-align: center;
font-size: 20px;
color: #999990;
}
.scoreActive {
border: 1px solid #388BE1;
background: #E4F1FF;
color: #388BE1;
}
}
}
</style>

View File

@@ -0,0 +1,297 @@
<template>
<div id="couser-list-content">
<div class="case-banner">
<PortalHeader current="course" textColor="#fff" :keywords="keyword" @emitInput="emitInput" @showClass="showClass" />
</div>
<div class="xcontent2">
<div class="xcontent2-main">
<div class="left-div">
<div class="navTitle">
<diV>
<template v-if="navTitle.length">
<div class="oneTitle" v-for="(item, index) in navTitle" :key="item.id" @click="">
<router-link :to="{ path: item.path, query: { id: !item.path ? queryId : undefined } }"
class="titleName">&nbsp;{{ item.name }}&nbsp;</router-link>
<span v-if="index !== navTitle.length - 1">></span>
</div>
</template>
</diV>
<div style="position: relative;">
<el-input class="portal-input" placeholder="请输入课程名称" style="border-radius: 20px !important; "
@keyup.enter.native="searchJump()" clearable maxlength="50" v-model="params.courseName">
</el-input>
<el-button class="sear-but" @click="searchJump()" type="primary" size="mini">搜索</el-button>
</div>
</div>
</div>
</div>
</div>
<!-- 教师赋能 -->
<div class="xindex-content" style="padding: 0">
<div class="modules xcontent2">
<div class="xcontent2-main">
<div class="modules-list list" style="margin-top: 0">
<!--内容列表内容-->
<div v-for="(course, ccidx) in courseList.list" :key="'cc' + ccidx" class="xindex-course"
style="position: relative">
<a @click="toCourseDetail(course)">
<div class="xindex-course-image">
<CourseImage :course="course"></CourseImage>
<span v-if="course.type == 20 || course.type == 10" class="course-type">录播课</span>
<span v-if="course.type == 30" class="course-type">面授课</span>
<span v-if="course.type == 40" class="course-type">学习项目</span>
</div>
<div style="width: 80%" :title="course.name" v-html="course.name"
class="course-title portal-title-tow two-line-ellipsis"></div>
<!-- 关键字 -->
<div class="keywordInfo-every">
<div class="keywordInfo" v-for="(keyword, index) in course.keywordsActive" :key="index">
<el-tooltip popper-class="keywordInfo-class" :visible-arrow="false" :disabled="!keyword.showTitle">
<template #content>
<span v-html="keyword.title"></span>
</template>
<div class="keyword-content" v-html="keyword.name"></div>
</el-tooltip>
</div>
</div>
<div class="course-author">
<div class="course-author-left">
{{ course.teacher }}
<span class="study-num">{{ formatNum(course.studies) }}人学习</span>
</div>
<div style="display: flex">
<div v-if="course.score != '0'">
<span class="course-score-value" style="margin-left: 10px">
{{ toScore(Number(course.score)) }}
</span>
</div>
<div v-else class="course-score-no">未评分</div>
</div>
</div>
</a>
</div>
</div>
<div v-if="courseList.length == 0" class="pagination-div">
<span class="notcoures">
<img :src="`${webBaseUrl}/images/nocase.png`" alt="">
<h5>暂无数据</h5>
</span>
</div>
</div>
</div>
</div>
<div v-if="courseList.length !== 0" style="margin-bottom: 45px;">
<pagination :size="params.pageSize" :total="total" :page="params.pageNo" @change-size="changePageSize"
@change-page="loadData" style="background-color: rgba(0, 0, 0, 0);" :autoScroll="false"
:pageSizes="[12, 24, 36, 48]"></pagination>
</div>
</div>
</template>
<script>
import PortalHeader from "@/components/PortalHeader.vue";
import TimeShow from "@/components/Portal/datetimeShow.vue";
import { formatUserNumber, toScore } from "@/utils/tools.js";
import CourseImage from "@/components/Course/courseImage.vue";
import InteractBar from "@/components/Portal/interactBar.vue";
export default {
name: 'CourseRecommended',
components: { PortalHeader, TimeShow, CourseImage, InteractBar },
data() {
return {
keyword: "",
formatNum: formatUserNumber,
toScore,
navTitle: [{
name: "课程",
path: '/course'
}, {
name: "推荐课程",
path: "/courseRecommended"
}, {
name: '项目管理系列课程',
path: ''
}],
total: 0,
params: {
pageNo: 1,
pageSize: 10,
courseName: '',
},
courseList: {
list: [{
id: 1,
title: "项目管理系列课程",
sysCreateTime: '2023-09-22',
name: "哈哈哈",
keywordsActive: [{
showTitle: false,
name: '<span>哈哈哈</span>',
title: "<span>哈哈哈</span>"
}, {
showTitle: false,
name: '<span>哈哈哈</span>',
title: "<span>哈哈哈</span>"
}, {
showTitle: false,
name: '<span>哈哈哈</span>',
title: "<span>哈哈哈</span>"
}, {
showTitle: false,
name: '<span>哈哈哈</span>',
title: "<span>哈哈哈</span>"
}, {
showTitle: false,
name: '<span>哈哈哈</span>',
title: "<span>哈哈哈</span>"
}],
summary: "哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊红i哈好哈啊哈好哈啊哈哈好哈哈啊哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊哈哈好哈哈啊"
}, {
id: 2,
title: "项目管理系列课程",
sysCreateTime: '2023-09-22',
name: "哈哈哈",
keywordsActive: [],
summary: "哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊红i哈好哈啊哈好哈啊哈哈好哈哈啊哈哈i啊hi哈斯哈塞回电话后啊后端哈说好话哦哈哈啊哈哈哈哈怂哈哈哦哈哈i哈哈地晒哦还好爱好i和腮红i哈好哈啊哈好哈啊哈哈好哈哈啊"
}],
showPagCount: 0,
count: 0
}
}
},
computed: {
queryId() {
console.log(this.$route.query);
return this.$route.query.id
}
},
mounted() {
},
methods: {
//课程列表详情
toCourseDetail(item) {
let courseId = item.id;
if (!courseId) {
courseId = item.courseId;
}
if (item.source == 1) {
this.$router.push('/course/boeframe?id=' + courseId + '&type=' + item.type);
} else if (item.source == 3) {
//跳转到管理系统的页面
let manageApi = process.env.VUE_APP_MANAGER_API_PATH;
let studentPath = process.env.VUE_APP_STUDENT_PATH;
if (item.type == 30) { //线下课,面授课
let params = encodeURIComponent('courseId=' + courseId);
this.$router.push('/forward?to=' + manageApi + '/stu/project/redirectDetail&params=' + params);
} else if (item.type == 40) { //学习项目
let params = encodeURIComponent('projectId=' + courseId);
this.$router.push('/forward?to=' + studentPath + '/projectdetails&params=' + params);
}
} else {
if (item.type == 10) {
this.$router.push("/course/studyindex?id=" + courseId);
} else if (item.type == 20) {
apiCourseStudy.hasSignup(courseId).then(rs => {
if (rs.status == 200) {
this.$router.push("/course/studyindex?id=" + courseId);
} else {
this.$router.push("/course/detail?id=" + courseId);
}
})
}
}
},
emitInput() {
},
showClass() { },
loadData() { },
changePageSize() { }
}
};
</script>
<style scoped lang="scss">
.case-banner {
position: relative;
height: 240px;
background: url('../../../../public/images/courseBanner.png');
margin-bottom: 30px;
&::before {
content: '课程推荐';
position: absolute;
bottom: 25px;
left: 240px;
font-size: 64px;
color: #FFFFFF;
}
}
/* 标题 */
.navTitle {
margin-bottom: 20px;
display: flex;
justify-content: space-between;
align-items: center;
& a:hover {
color: #387DF7;
}
.oneTitle {
display: inline-block;
cursor: pointer;
& .titleName:hover {
color: #387DF7;
}
}
.sear-but {
position: absolute;
bottom: 10%;
right: 5px;
}
}
.xindex-course-image:hover {
transform: scale(1.25) translateY(-15px);
transition: all 0.6s;
}
// 关键字卡片的样式
.keywordInfo-every {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 5px;
.keywordInfo {
width: 100%;
font-size: 12px;
line-height: 26px;
background: #F2F5F7;
border-radius: 4px;
border: 1px solid #387DF7;
.keyword-content {
color: #387DF7;
text-align: center;
}
}
& .keywordInfo:last-child {
margin-right: 0 !important;
}
}
.courseTime {
bottom: 0px;
right: 0px;
padding: 0 20px;
background-color: #f99000;
border-radius: 8px 2px 3px 2px;
}
</style>

View File

@@ -21,6 +21,10 @@
<div class="xcontent2">
<!-- 左侧三级 -->
<div class="xcontent2-minor" style="margin-right:36px;">
<!-- <router-link to="/courseRecommended" style="margin-bottom: 20px;" class="course-recommended-style">
<div class="imgTilte">
</div>
</router-link> -->
<div class="course-title-style">
<div class="imgTilte">
<div>课程分类</div>
@@ -663,18 +667,18 @@ export default {
localSessionKey: this.$xpage.constants.localCourseFiltersKey
};
},
created() {
let localKey = "user_" + this.userInfo.sysId + "_gids";
apiUserbasic.getInAudienceIds().then(rs => {
if (rs.status == 200) {
this.audiences = rs.result;
sessionStorage.setItem(localKey, this.audiences);
} else {
console.log(rs.message);
}
})
},
// 受众需要每次刷新
// created() {
// let localKey = "user_" + this.userInfo.sysId + "_gids";
// apiUserbasic.getInAudienceIds().then(rs => {
// if (rs.status == 200) {
// this.audiences = rs.result;
// sessionStorage.setItem(localKey, this.audiences);
// } else {
// console.log(rs.message);
// }
// })
// },
mounted() {
let screenWidth = window.screen.availWidth;
// if (screenWidth < 1280) {
@@ -715,38 +719,38 @@ export default {
// this.toCourseDetail(item);
// this.orderChange(id);
//查询排行榜,页面打开只查询一次
// let localKey = "user_" + this.userInfo.sysId + "_gids";
// if (this.audiences.length == 0) {
// //let hasIds;
// let hasIds = sessionStorage.getItem(localKey);
// if (hasIds && hasIds.length > 0) {
// this.audiences = hasIds.split(",");
// this.search();
// } else {
// apiUserbasic.getInAudienceIds().then(rs => {
// if (rs.status == 200) {
// this.audiences = rs.result;
// sessionStorage.setItem(localKey, this.audiences);
// } else {
// console.log(rs.message);
// }
// // this.search();
// })
// // Promise.all([apiOldCourse.audience(this.userInfo.sysId),apiUserGroup.userGroupIds()]).then(rs=>{
// // //console.log(rs,'rs');
// // let aids=[];
// // if(rs[0].status==200){
// // aids.push(rs[0].result);
// // }
// // if(rs[1].status==200){
// // aids.push(rs[1].result);
// // }
// // this.audiences=aids;
// // sessionStorage.setItem(localKey,this.audiences);
// // this.search();
// // })
// }
// }
let localKey = "user_" + this.userInfo.sysId + "_gids";
if (this.audiences.length == 0) {
//let hasIds;
let hasIds = sessionStorage.getItem(localKey);
if (hasIds && hasIds.length > 0) {
this.audiences = hasIds.split(",");
this.search();
} else {
apiUserbasic.getInAudienceIds().then(rs => {
if (rs.status == 200) {
this.audiences = rs.result;
sessionStorage.setItem(localKey, this.audiences);
} else {
console.log(rs.message);
}
this.search();
})
// Promise.all([apiOldCourse.audience(this.userInfo.sysId),apiUserGroup.userGroupIds()]).then(rs=>{
// //console.log(rs,'rs');
// let aids=[];
// if(rs[0].status==200){
// aids.push(rs[0].result);
// }
// if(rs[1].status==200){
// aids.push(rs[1].result);
// }
// this.audiences=aids;
// sessionStorage.setItem(localKey,this.audiences);
// this.search();
// })
}
}
//this.searchterm();//搜索词已经没有了
this.couresreso();//广告位
@@ -1080,7 +1084,7 @@ export default {
});
this.loadLocalFilters();
this.search()
// this.search()
}
} catch (error) {
console.log(error);
@@ -1577,6 +1581,15 @@ export default {
}
// 三级背景高度
.course-recommended-style{
position: relative;
height: 142px;
background-image: url('../../../assets/images/course/courserecommended.png');
background-repeat: no-repeat;
background-size: 100% 100%;
display: flex;
align-items: center;
}
.course-title-style {
position: relative;
height: 100px;

View File

@@ -491,10 +491,11 @@
}
});
//每一分钟保存一次
let $this=this;
this.appendStudyOtherHandle = setTimeout(function() {
$this.appendStudyOtherTime();
}, 1000*60);
// 取消阅读的每分钟六十秒的计时
// let $this=this;
// this.appendStudyOtherHandle = setTimeout(function() {
// $this.appendStudyOtherTime();
// }, 1000*60);
},
//笔记组件触发,播放指定时间