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 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){ const courselist=function (data){
return ajax.post('/xboe/portal/index/courselist',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 { export default {
cases, cases,
@@ -52,5 +60,6 @@ export default {
qaAnswers, qaAnswers,
articlelist, articlelist,
courselist, 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{ .xindex-ranking-li{
margin-top:15px; margin-top:15px;
} }
.xindex-ranking-review{
height: 186px;
}
.xindex-ranking-course{ .xindex-ranking-course{
height: 465px; height: 452px;
} }
.xindex-ranking-case{ .xindex-ranking-case{
@@ -777,8 +783,14 @@
.xindex-ranking-li{ .xindex-ranking-li{
margin-top:20px; margin-top:20px;
} }
.reviewTop{
margin-top: 20px;
}
.xindex-ranking-review{
height: 204px;
}
.xindex-ranking-course{ .xindex-ranking-course{
height: 509px; height: 508px;
} }
.xindex-ranking-case{ .xindex-ranking-case{
@@ -1059,8 +1071,14 @@
.xindex-ranking-li{ .xindex-ranking-li{
margin-top:30px; margin-top:30px;
} }
.reviewTop{
margin-top: 30px;
}
.xindex-ranking-review{
height: 249px;
}
.xindex-ranking-course{ .xindex-ranking-course{
height: 592px; height: 598px;
} }
.xindex-ranking-case{ .xindex-ranking-case{
@@ -1324,8 +1342,14 @@
.xindex-ranking-li{ .xindex-ranking-li{
margin-top:30px; margin-top:30px;
} }
.reviewTop{
margin-top: 36px;
}
.xindex-ranking-review{
height: 272px;
}
.xindex-ranking-course{ .xindex-ranking-course{
height: 614px; height: 650px;
} }
.xindex-ranking-case{ .xindex-ranking-case{

View File

@@ -110,6 +110,20 @@ export const constantRoutes = [{
name: 'course', name: 'course',
meta: { title: '课程', keepAlive: true, icon: 'dashboard', noCache: true, affix: false }, 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', path: '/course/micro',
hidden: true, hidden: true,

View File

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

View File

@@ -211,7 +211,7 @@
</div> --> </div> -->
<!--内容列表内容--> <!--内容列表内容-->
<div <div
v-for="(course, ccidx) in courseList.list" v-for="(course, ccidx) in courseComputedOneList"
:key="'cc' + ccidx" :key="'cc' + ccidx"
class="xindex-course" class="xindex-course"
style="position: relative" style="position: relative"
@@ -263,12 +263,118 @@
</div> </div>
</a> </a>
</div> </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> </div>
<div class="xcontent2-minor" style="margin-top: 60px"> <div class="xcontent2-minor" style="margin-top: 60px">
<div class="portal-ranking ranking-bg"> <div class="portal-ranking ranking-bg">
<p class="ranking-title">课程排行</p> <p class="ranking-title">课程热度</p>
<ul class="xindex-ranking-course"> <ul class="xindex-ranking-course">
<li <li
class="xindex-ranking-li" class="xindex-ranking-li"
@@ -317,6 +423,27 @@
</li> </li>
</ul> </ul>
</div> </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>
</div> </div>
<!-- 推荐案例2版 --> <!-- 推荐案例2版 -->
@@ -947,6 +1074,7 @@ export default {
}, },
data() { data() {
return { return {
Positive:[],
showUClass: false, showUClass: false,
showLoginMedal: false, //是否显示登录勋章 showLoginMedal: false, //是否显示登录勋章
needLoginMedal: false, //是否需要显示纪念勋章 needLoginMedal: false, //是否需要显示纪念勋章
@@ -968,6 +1096,7 @@ export default {
ankingList: [], ankingList: [],
answersList: [], answersList: [],
Popularity: [], Popularity: [],
reviewList:[],//好评
scorelist: [], scorelist: [],
resonimg: [], resonimg: [],
swiperOptiontwo: { swiperOptiontwo: {
@@ -1004,6 +1133,10 @@ export default {
orderType: 2, orderType: 2,
list: [], list: [],
}, },
// 推荐课程
recommendedList:{
list: [],
},
caseList: { caseList: {
num: 3, num: 3,
orderType: 2, orderType: 2,
@@ -1027,6 +1160,8 @@ export default {
}, },
mounted() { mounted() {
this.getCourseData(1); this.getCourseData(1);
this.getRecommendList();
this.getPositive()
this.getCaseData(); this.getCaseData();
this.getArticleData(); this.getArticleData();
this.getQaData(); this.getQaData();
@@ -1082,8 +1217,22 @@ export default {
swiper() { swiper() {
return this.$refs.mySwiper.swiper; return this.$refs.mySwiper.swiper;
}, },
courseComputedOneList(){
return this.courseList.list.slice(0,3)
},
courseComputedTwoList(){
return this.courseList.list.slice(3)
},
}, },
methods: { methods: {
getPositive() {
apiCase.queryComments(10).then(res => {
if (res.status == 200) {
this.Positive = res.result;
console.log(res);
}
});
},
tylClick() { tylClick() {
window.open("https://m.qingxuetang.com/x/?appId=qxtcorp306130"); window.open("https://m.qingxuetang.com/x/?appId=qxtcorp306130");
}, },
@@ -1280,6 +1429,29 @@ export default {
if (this.isNext) { if (this.isNext) {
this.getCourseData(this.pageIndex); 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) { getCourseData(pageIndex) {
this.isNext = false; this.isNext = false;

View File

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

View File

@@ -4,6 +4,43 @@
<portal-header current="case" textColor="#fff" @emitInput="emitInput" @showClass="showClass"></portal-header> <portal-header current="case" textColor="#fff" @emitInput="emitInput" @showClass="showClass"></portal-header>
</div> </div>
<div class="xcontent2"> <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="xcontent2-main" style="margin-right: 30px;">
<div class="left-div"> <div class="left-div">
<div class="search-div"> <div class="search-div">
@@ -211,6 +248,7 @@
</div> </div>
</div> </div>
<!-- 打开排行榜 -->
<div class="xcontent2-minor"> <div class="xcontent2-minor">
<div id="fixd-box"> <div id="fixd-box">
<div class="portal-ranking ranking-bg"> <div class="portal-ranking ranking-bg">
@@ -265,10 +303,6 @@
</li> </li>
</ul> </ul>
</div> </div>
<!-- <div class="course-resources pointer"> -->
<!-- 资源位 -->
<!-- <img @click="banJump()" :src="fileBaseUrl + resonimg.image" alt=""> -->
<!-- </div> -->
</div> </div>
</div> </div>
<div style="height: 50px;"></div> <div style="height: 50px;"></div>
@@ -361,6 +395,8 @@ export default {
}, },
data() { data() {
return { return {
twoId:'',
treeList:[],
caseType:process.env.VUE_APP_CASE_TYPE,//类型 caseType:process.env.VUE_APP_CASE_TYPE,//类型
caseYears:[], caseYears:[],
refId: '',//消息跳转案例的id refId: '',//消息跳转案例的id
@@ -413,6 +449,9 @@ export default {
notInIds: [],//重复的id notInIds: [],//重复的id
orderField: "id", orderField: "id",
orderAsc: false,//排序 orderAsc: false,//排序
sysType1:'',
sysType2:'',
sysType3:''
}, },
keyWord: "", keyWord: "",
anking: 2, anking: 2,
@@ -478,6 +517,29 @@ export default {
list.push(item); 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; return list;
}, },
oneTagAll() { oneTagAll() {
@@ -626,9 +688,11 @@ export default {
if (this.refId) { if (this.refId) {
this.queryCondition.type = 'recommend' this.queryCondition.type = 'recommend'
} }
this.loadTypeData();//加载分类
this.getAnkingData(); this.getAnkingData();
this.getPopularity();
this.searchterm(); this.searchterm();
//打开排行榜下边的两个
this.getPopularity();
this.getPositive(); this.getPositive();
this.couresreso(); this.couresreso();
// window.addEventListener("scroll", this.handleScroll); // window.addEventListener("scroll", this.handleScroll);
@@ -642,6 +706,67 @@ export default {
}, },
methods: { 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() { getYears() {
apiCase.caseYears().then(res => { apiCase.caseYears().then(res => {
if (res.status == 200) { if (res.status == 200) {
@@ -1232,7 +1357,16 @@ export default {
// } // }
// }, // },
tagsClose(tag, index) { 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) { if (tag.type == 0) {
this.keyWord = ''; this.keyWord = '';
} }
@@ -1334,6 +1468,77 @@ export default {
</script> </script>
<style scoped lang="scss"> <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 { .u-class {
::v-deep .el-dialog { ::v-deep .el-dialog {
border-radius: 15px; 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">
<!-- 左侧三级 --> <!-- 左侧三级 -->
<div class="xcontent2-minor" style="margin-right:36px;"> <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="course-title-style">
<div class="imgTilte"> <div class="imgTilte">
<div>课程分类</div> <div>课程分类</div>
@@ -663,18 +667,18 @@ export default {
localSessionKey: this.$xpage.constants.localCourseFiltersKey localSessionKey: this.$xpage.constants.localCourseFiltersKey
}; };
}, },
// 受众需要每次刷新
created() { // created() {
let localKey = "user_" + this.userInfo.sysId + "_gids"; // let localKey = "user_" + this.userInfo.sysId + "_gids";
apiUserbasic.getInAudienceIds().then(rs => { // apiUserbasic.getInAudienceIds().then(rs => {
if (rs.status == 200) { // if (rs.status == 200) {
this.audiences = rs.result; // this.audiences = rs.result;
sessionStorage.setItem(localKey, this.audiences); // sessionStorage.setItem(localKey, this.audiences);
} else { // } else {
console.log(rs.message); // console.log(rs.message);
} // }
}) // })
}, // },
mounted() { mounted() {
let screenWidth = window.screen.availWidth; let screenWidth = window.screen.availWidth;
// if (screenWidth < 1280) { // if (screenWidth < 1280) {
@@ -715,38 +719,38 @@ export default {
// this.toCourseDetail(item); // this.toCourseDetail(item);
// this.orderChange(id); // this.orderChange(id);
//查询排行榜,页面打开只查询一次 //查询排行榜,页面打开只查询一次
// let localKey = "user_" + this.userInfo.sysId + "_gids"; let localKey = "user_" + this.userInfo.sysId + "_gids";
// if (this.audiences.length == 0) { if (this.audiences.length == 0) {
// //let hasIds; //let hasIds;
// let hasIds = sessionStorage.getItem(localKey); let hasIds = sessionStorage.getItem(localKey);
// if (hasIds && hasIds.length > 0) { if (hasIds && hasIds.length > 0) {
// this.audiences = hasIds.split(","); this.audiences = hasIds.split(",");
// this.search(); this.search();
// } else { } else {
// apiUserbasic.getInAudienceIds().then(rs => { apiUserbasic.getInAudienceIds().then(rs => {
// if (rs.status == 200) { if (rs.status == 200) {
// this.audiences = rs.result; this.audiences = rs.result;
// sessionStorage.setItem(localKey, this.audiences); sessionStorage.setItem(localKey, this.audiences);
// } else { } else {
// console.log(rs.message); console.log(rs.message);
// } }
// // this.search(); this.search();
// }) })
// // Promise.all([apiOldCourse.audience(this.userInfo.sysId),apiUserGroup.userGroupIds()]).then(rs=>{ // Promise.all([apiOldCourse.audience(this.userInfo.sysId),apiUserGroup.userGroupIds()]).then(rs=>{
// // //console.log(rs,'rs'); // //console.log(rs,'rs');
// // let aids=[]; // let aids=[];
// // if(rs[0].status==200){ // if(rs[0].status==200){
// // aids.push(rs[0].result); // aids.push(rs[0].result);
// // } // }
// // if(rs[1].status==200){ // if(rs[1].status==200){
// // aids.push(rs[1].result); // aids.push(rs[1].result);
// // } // }
// // this.audiences=aids; // this.audiences=aids;
// // sessionStorage.setItem(localKey,this.audiences); // sessionStorage.setItem(localKey,this.audiences);
// // this.search(); // this.search();
// // }) // })
// } }
// } }
//this.searchterm();//搜索词已经没有了 //this.searchterm();//搜索词已经没有了
this.couresreso();//广告位 this.couresreso();//广告位
@@ -1080,7 +1084,7 @@ export default {
}); });
this.loadLocalFilters(); this.loadLocalFilters();
this.search() // this.search()
} }
} catch (error) { } catch (error) {
console.log(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 { .course-title-style {
position: relative; position: relative;
height: 100px; height: 100px;

View File

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