hz/learning-system-portal
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git synced 2025-12-11 03:46:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
zhaofang
2022-09-26 20:11:22 +08:00
parent 147e7a2fcf
commit 96e07d3135
13 changed files with 80 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/images/listblue010.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 629 B

BIN
public/images/listblue04.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 738 B

BIN
public/images/listblue05.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 840 B

BIN
public/images/listblue06.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 864 B

BIN
public/images/listblue07.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 776 B

BIN
public/images/listblue08.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 887 B

BIN
public/images/listblue09.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 863 B

2
src/api/phase2/index.js
View File

@@ -3,7 +3,7 @@ import ajax from '@/utils/xajax.js'
/** /**
* 首页推荐案例 * 首页推荐案例
* @param type 1最热 2最新 * @param type 2最热 1最新
* */ * */
const cases=function (type){ const cases=function (type){
return ajax.get('/xboe/portal/index/cases?type='+type); return ajax.get('/xboe/portal/index/cases?type='+type);

6
src/assets/styles/portal-index.scss
View File

@@ -53,6 +53,12 @@
color: #00253E; color: #00253E;
line-height: 22px; line-height: 22px;
} }
.portal-index-summary{
font-size: 14px;
font-weight: 400;
color: #04243C;
line-height: 24px;
}
.portal-summary-text{ // 问答详情 .portal-summary-text{ // 问答详情
font-size: 14px; font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;

8
src/assets/styles/portal.scss
View File

@@ -41,10 +41,10 @@ body {
// margin: 0px auto; // margin: 0px auto;
} }
.index-course{ .index-course{
width: 25%; // width: 25%;
} }
.course-index{ .course-index{
width: 33.3333%; // width: 33.3333%;
} }
} }
@@ -89,11 +89,11 @@ body {
} }
.index-course{ .index-course{
// width: 16.6666666667%; // width: 16.6666666667%;
width: 33.3333%; // width: 33.3333%;
} }
.course-index{ .course-index{
// width: 20%; // width: 20%;
width: 33.3333%; // width: 33.3333%;
} }
} }

2
src/components/UcHeader/Index.vue
View File

@@ -181,7 +181,7 @@ import {userAvatarText,cutFullName} from "@/utils/tools.js";
this.uinfo.monthTotalDay = item.total; this.uinfo.monthTotalDay = item.total;
} }
if(item.statType == 30) { if(item.statType == 30) {
this.uinfo.uCurrency = item.todays; this.uinfo.uCurrency = item.total;
} }
}); });
} }

170
src/views/Index.vue
View File

@@ -22,15 +22,15 @@
<ul class="personal-ul"> <ul class="personal-ul">
<li> <li>
<span class="label">累计学习</span> <span class="label">累计学习</span>
<p><span>120.75</span>小时</p> <p><span>{{userData.studyHourValue}}</span>小时</p>
</li> </li>
<li> <li>
<span class="label">经验值等级</span> <span class="label">经验值等级</span>
<p><span>L1</span></p> <p><span>{{userData.level}}</span></p>
</li> </li>
<li> <li>
<span class="label">我的U币</span> <span class="label">我的U币</span>
<p><span>307</span>个</p> <p><span>{{userData.coinValue}}</span>个</p>
</li> </li>
</ul> </ul>
</div> </div>
@@ -58,10 +58,10 @@
<div class="modules-list xrow" style="height: 485px;overflow: hidden;"> <div class="modules-list xrow" style="height: 485px;overflow: hidden;">
<!--一个固定内容--> <!--一个固定内容-->
<div class="xrow-course index-course"> <div class="xrow-course index-course">
<el-card class="course-card" :body-style="{ padding: '0px' }"> <div class="course-card">
<a href="course/boeframe?id=517CA622-238E-06BA-0AED-B1200D705800&type=online-course"> <a href="course/boeframe?id=517CA622-238E-06BA-0AED-B1200D705800&type=online-course">
<div class="course-image-box"> <div class="course-image-box">
<el-image class="course-image" style="height: 130px;" :src="this.webBaseUrl+'/ad/index_course.png'" fit="fit"></el-image> <el-image class="course-image" style="height: 200px;" :src="this.webBaseUrl+'/ad/index_course.png'" fit="fit"></el-image>
<span class="course-type">录播课</span> <span class="course-type">录播课</span>
</div> </div>
<div title="高效谈判系列课" class="course-title one-line-ellipsis">高效谈判系列课</div> <div title="高效谈判系列课" class="course-title one-line-ellipsis">高效谈判系列课</div>
@@ -77,14 +77,14 @@
</div> </div>
</div> </div>
</a> </a>
</el-card> </div>
</div> </div>
<!--内容列表内容--> <!--内容列表内容-->
<div v-for="course in courseList.list" :key="course.id" class="xrow-course index-course"> <div v-for="course in courseList.list" :key="course.id" class="xrow-course index-course">
<div class="course-card"> <div class="course-card">
<a :href="toCourseDetail(course)"> <a :href="toCourseDetail(course)">
<div class="course-image-box"> <div class="course-image-box">
<course-image height="130px" :course="course"></course-image> <course-image height="200px" :course="course"></course-image>
<span v-if="course.type == 20 || 10" class="course-type">录播课</span> <span v-if="course.type == 20 || 10" class="course-type">录播课</span>
</div> </div>
<div :title="course.name" class="course-title one-line-ellipsis" >{{ course.name }}</div> <div :title="course.name" class="course-title one-line-ellipsis" >{{ course.name }}</div>
@@ -103,7 +103,6 @@
</div> </div>
</div> </div>
</a> </a>
<!-- 收藏位置 -->
<div class="cor-praises"><interactBar :type="1" :data="course" :comments="false" :praises="false" :shares="false" :views="false"></interactBar></div> <div class="cor-praises"><interactBar :type="1" :data="course" :comments="false" :praises="false" :shares="false" :views="false"></interactBar></div>
</div> </div>
</div> </div>
@@ -115,20 +114,8 @@
<p class="portal-title-one" style="padding-bottom:12px">课程排行榜</p> <p class="portal-title-one" style="padding-bottom:12px">课程排行榜</p>
<ul> <ul>
<li class="list-info" v-for="(item, index) in scorelist" :key="index" style="cursor: pointer;margin-top:24px;line-height: 30px;display: flex;"> <li class="list-info" v-for="(item, index) in scorelist" :key="index" style="cursor: pointer;margin-top:24px;line-height: 30px;display: flex;">
<span class="portal-right-text blue-one" v-if="index==0"> <span class="portal-right-text blue-one">
<img src="/images/listblue01.png" alt=""> <img :src="getPic(index)" alt="">
</span>
<span class="portal-right-text blue-tow" v-if="index==1">
<img src="/images/listblue02.png" alt="">
</span>
<span class="portal-right-text blue-three" v-if="index==2">
<img src="/images/listblue03.png" alt="">
</span>
<span class="portal-right-text" v-if="index==3">
<img src="/images/list04.png" alt="">
</span>
<span class="portal-right-text" v-if="index==4">
<img src="/images/list05.png" alt="">
</span> </span>
<span class="portal-title-desc title-line-ellipsis" v-if="item.images == ''" style="font-size: 14px;">{{ item.name }}</span> <span class="portal-title-desc title-line-ellipsis" v-if="item.images == ''" style="font-size: 14px;">{{ item.name }}</span>
<span class="portal-title-desc" v-else style="font-size: 14px;"> <span class="portal-title-desc" v-else style="font-size: 14px;">
@@ -170,12 +157,12 @@
</div> </div>
<div class="modules-list"> <div class="modules-list">
<ul class="case-box"> <ul class="case-box">
<li class="case-index" v-for="ca in caseList.list" :key="ca.id"> <li class="case-index" v-for="(ca,ind) in caseList.list" :key="ca.id">
<div class="case-top"></div> <div class="case-top"></div>
<div class="case-conent"> <div class="case-conent">
<p class="cast-time"> <p class="cast-time">
<span><svg-icon style="margin-right: 0;font-size:16px;" icon-class="crown"></svg-icon>人气榜NO.1</span> <span class="time-one" v-if="caseList.orderType==2"><svg-icon style="margin-right: 0;font-size:16px;" icon-class="crown"></svg-icon>人气榜NO.{{ind+1}}</span>
<span>2022-05-19</span> <span style="float: right;">2022-05-19</span>
</p> </p>
<p :title="ca.title" class="two-line-ellipsis case-title">{{ca.title}}</p> <p :title="ca.title" class="two-line-ellipsis case-title">{{ca.title}}</p>
<p class="case-text three-line-ellipsis">{{ca.summary}}</p> <p class="case-text three-line-ellipsis">{{ca.summary}}</p>
@@ -190,24 +177,12 @@
</div> </div>
</div> </div>
<div> <div>
<div style="margin-top:46px" class="ranking-card portal-right-box list-bg1"> <div style="margin-top:46px" class="ranking-card portal-right-box list-bg">
<p class="portal-title-one" style="padding-bottom:12px">案例排行榜</p> <p class="portal-title-one" style="padding-bottom:12px">案例排行榜</p>
<ul> <ul>
<li v-for="(item, index) in Popularity" :key="index" class="title-line-ellipsis" style="cursor: pointer;margin-top:30px;line-height: 22px;"> <li v-for="(item, index) in Popularity" :key="index" class="title-line-ellipsis" style="cursor: pointer;margin-top:30px;line-height: 22px;">
<span class="portal-right-text orange-one" v-if="index==0"> <span class="portal-right-text orange-one">
<img src="/images/list-01.png" alt=""> <img :src="getPic(index)" alt="">
</span>
<span class="portal-right-text orange-tow" v-if="index==1">
<img src="/images/list02.png" alt="">
</span>
<span class="portal-right-text orange-three" v-if="index==2">
<img src="/images/list03.png" alt="">
</span>
<span class="portal-right-text" v-if="index==3">
<img src="/images/list04.png" alt="">
</span>
<span class="portal-right-text" v-if="index==4">
<img src="/images/list05.png" alt="">
</span> </span>
<span class="portal-title-desc" style="font-size: 14px;">{{ item.title }}</span> <span class="portal-title-desc" style="font-size: 14px;">{{ item.title }}</span>
</li> </li>
@@ -292,28 +267,16 @@
</div> </div>
</div> </div>
<!--内容块--> <!--内容块-->
<div> <div style="margin-top:46px">
<!-- 排行榜位置 --> <!-- 排行榜位置 -->
<div class="portal-right-box art-bgimg" style="background-color:#fff;"> <div class="portal-right-box art-bgimg" style="background-color:#fff;" >
<p class="portal-title-one" style="padding-bottom:12px" >文章排行榜</p> <p class="portal-title-one" style="padding-bottom:12px" >文章排行榜</p>
<ul> <ul>
<li v-for="(item, index) in ankingList" :key="index" style="margin-top:30px;line-height: 22px;cursor: pointer;"> <li v-for="(item, index) in ankingList" :key="index" style="margin-top:30px;line-height: 22px;cursor: pointer;">
<span class="portal-right-text orange-one" v-if="index==0" style="margin-right:94px"> <span class="portal-right-text orange-one">
<img src="/images/list-01.png" alt=""> <img :src="getPic(index)" alt="">
</span> </span>
<span class="portal-right-text orange-tow" v-if="index==1" style="margin-right:94px"> <span class="portal-index-summary">{{ item.title }}</span>
<img src="/images/list02.png" alt="">
</span>
<span class="portal-right-text orange-three" v-if="index==2" style="margin-right:94px">
<img src="/images/list03.png" alt="">
</span>
<span class="portal-right-text" v-if="index==3" style="margin-right:94px">
<img src="/images/list04.png" alt="">
</span>
<span class="portal-right-text" v-if="index==4" style="margin-right:94px">
<img src="/images/list05.png" alt="">
</span>
<span class="portal-title-desc">{{ item.sysCreateUname }}</span>
</li> </li>
</ul> </ul>
</div> </div>
@@ -336,7 +299,7 @@
<!--内容列表内容--> <!--内容列表内容-->
<ul class="qa-box"> <ul class="qa-box">
<li class="qa-card" v-for="qa in qaList.list" :key="qa.id"> <li class="qa-card" v-for="qa in qaList.list" :key="qa.id">
<p class="qa-top"><span>300正在关注</span><span>{{ qa.sysCreateTime.substring(0, 10) }}</span></p> <p class="qa-top"><span>{{qa.views}}正在关注</span><span>{{ qa.sysCreateTime.substring(0, 10) }}</span></p>
<div class="qa-center"> <div class="qa-center">
<p class="one-line-ellipsis portal-index-title" style="color:#181818;">{{ qa.title }}</p> <p class="one-line-ellipsis portal-index-title" style="color:#181818;">{{ qa.title }}</p>
<p class="portal-summary-text two-line-ellipsis" style="color:#6E7B84;margin-top: 12px;">{{ qa.content }}</p> <p class="portal-summary-text two-line-ellipsis" style="color:#6E7B84;margin-top: 12px;">{{ qa.content }}</p>
@@ -346,35 +309,23 @@
<author-img :avatar="qa.authorInfo.avatar" :aid="qa.authorInfo.aid" :sex="qa.authorInfo.sex"></author-img> <author-img :avatar="qa.authorInfo.avatar" :aid="qa.authorInfo.aid" :sex="qa.authorInfo.sex"></author-img>
<div> <div>
<p class="info-name">{{qa.authorInfo.name}}</p> <p class="info-name">{{qa.authorInfo.name}}</p>
<p style="margin-left:2px"><interactBar :type="4" :readonly="true" :data="qa" :comments="true" :shares="false" :praises="false" :views="false"></interactBar></p> <p style="margin-left:2px"><interactBar :type="4" :readonly="true" :data="qa" :comments="false" :answers="true" :shares="false" :praises="false" :views="false"></interactBar></p>
</div> </div>
</div> </div>
</li> </li>
</ul> </ul>
</el-row> </el-row>
</div> </div>
<div> <div style="margin-top:60px">
<!-- 排行榜 --> <!-- 排行榜 -->
<div class="portal-right-box list-bg" style="margin-top:62px"> <div class="portal-right-box list-bg">
<p class="portal-title-one" style="padding-bottom:12px">问答排行榜</p> <p class="portal-title-one" style="padding-bottom:12px">问答排行榜</p>
<ul> <ul>
<li v-for="(item, index) in ankingList" :key="index" style="margin-top:30px;line-height: 22px;cursor: pointer;"> <li v-for="(item, index) in answersList" :key="index" style="margin-top:30px;line-height: 22px;cursor: pointer;">
<span class="portal-right-text orange-one" v-if="index==0" style="margin-right:94px"> <span class="portal-right-text orange-one">
<img src="/images/list-01.png" alt=""> <img :src="getPic(index)" alt="">
</span> </span>
<span class="portal-right-text orange-tow" v-if="index==1" style="margin-right:94px"> <span class="portal-index-summary">{{ item.title }}</span>
<img src="/images/list02.png" alt="">
</span>
<span class="portal-right-text orange-three" v-if="index==2" style="margin-right:94px">
<img src="/images/list03.png" alt="">
</span>
<span class="portal-right-text" v-if="index==3" style="margin-right:94px">
<img src="/images/list04.png" alt="">
</span>
<span class="portal-right-text" v-if="index==4" style="margin-right:94px">
<img src="/images/list05.png" alt="">
</span>
<span class="portal-title-desc">{{ item.sysCreateUname }}</span>
</li> </li>
</ul> </ul>
</div> </div>
@@ -408,17 +359,21 @@ import { toScore,cutFullName} from '@/utils/tools.js';
import { swiper, swiperSlide } from 'vue-awesome-swiper'; import { swiper, swiperSlide } from 'vue-awesome-swiper';
import apiPlace from "@/api/phase2/place.js" import apiPlace from "@/api/phase2/place.js"
import AuthorImg from '@/components/Portal/authorImg.vue'; import AuthorImg from '@/components/Portal/authorImg.vue';
import apiStart from '@/api/phase2/stat.js'
import apiIndex from '@/api/phase2/index.js'
export default { export default {
name: 'index', name: 'index',
components: {AuthorImg, portalHeader,ad, portalFooter, articleImage, portalFloatTools, authorInfo, interactRowBar, interactBar, courseImage }, components: {AuthorImg, portalHeader,ad, portalFooter, articleImage, portalFloatTools, authorInfo, interactRowBar, interactBar, courseImage },
computed: { computed: {
// ...mapGetters(['userInfo']) ...mapGetters(['userInfo'])
}, },
data() { data() {
return { return {
userData:{},
userInfo:{}, userInfo:{},
ankingList:[], ankingList:[],
answersList:[],
Popularity:[], Popularity:[],
scorelist:[], scorelist:[],
resonimg:[], resonimg:[],
@@ -481,6 +436,8 @@ export default {
this.getScoreList(); this.getScoreList();
this.getPopularity(); this.getPopularity();
this.getAnkingData(); this.getAnkingData();
this.getLevel();
this.getQaAnswers();
}, },
computed: { computed: {
@@ -496,15 +453,33 @@ export default {
// }) // })
}, },
methods: { methods: {
getPic(index) {
return `/images/listblue0${index+1}.png`
},
getLevel(){//获取经验值和等级
apiStart.getUserStatTotalInfo(this.userInfo.aid).then(res=>{
if(res.status == 200) {
this.userData = res.result;
}
});
},
getQaAnswers() {
apiIndex.qaAnswers(3).then(res=>{
if (res.status == 200) {
this.answersList = res.result;
}
})
},
getAnkingData() {// 文章排行榜 getAnkingData() {// 文章排行榜
apiArticle.countsUsername(5).then(res => { apiIndex.articleViews(7).then(res => {
if (res.status == 200) { if (res.status == 200) {
this.ankingList = res.result; this.ankingList = res.result;
} }
}); });
}, },
getPopularity() {//案例排行榜 getPopularity() {//案例排行榜
apiCase.queryPraises(5).then(res => { apiCase.queryPraises(4).then(res => {
if (res.status == 200) { if (res.status == 200) {
this.Popularity = res.result; this.Popularity = res.result;
// console.log(this.Popularity) // console.log(this.Popularity)
@@ -615,15 +590,7 @@ export default {
this.getCaseData(); this.getCaseData();
}, },
getCaseData() { getCaseData() {
let params = { apiIndex.cases(this.caseList.orderType).then(res => {
pageSize: this.caseList.num,
orderAsc: false,
orderField: 'id'
};
if (this.caseList.orderType == 2) {
params.orderField = 'comments';
}
apiCase.indexList(params).then(res => {
if (res.status == 200) { if (res.status == 200) {
if (res.result.length > 0) { if (res.result.length > 0) {
let userIds = []; let userIds = [];
@@ -775,7 +742,6 @@ export default {
}); });
} else { } else {
console.log('加载用户信息失败:' + res.error); console.log('加载用户信息失败:' + res.error);
//this.$message.error(res.message);
} }
}); });
}, },
@@ -799,12 +765,10 @@ export default {
}); });
} else { } else {
console.log('加载用户信息失败:' + res.error); console.log('加载用户信息失败:' + res.error);
//this.$message.error(res.message);
} }
}); });
}, },
jumpRouter(item) { jumpRouter(item) {
// window.open(`${this.webBaseUrl}/qa/answer?id=${item.id}`)
this.$router.push({ path: '/qa/answer', query: { id: item.id } }); this.$router.push({ path: '/qa/answer', query: { id: item.id } });
} }
} }
@@ -820,7 +784,7 @@ export default {
height: 370px; height: 370px;
background: rgba(0,0,0,0.39); background: rgba(0,0,0,0.39);
border-radius: 8px; border-radius: 8px;
z-index: 999999; z-index: 999;
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
padding: 38px 47px 31px 32px; padding: 38px 47px 31px 32px;
text-align: center; text-align: center;
@@ -1051,10 +1015,10 @@ export default {
.cast-time{ .cast-time{
font-size: 14px; font-size: 14px;
color: #6E7B84; color: #6E7B84;
display: flex; // display: flex;
justify-content: space-between; // justify-content: space-between;
margin-bottom: 20px; margin-bottom: 20px;
span:first-child{ .time-one{
height: 24px; height: 24px;
background: rgba($color: #387DF7, $alpha: 0.1); background: rgba($color: #387DF7, $alpha: 0.1);
border-radius: 4px; border-radius: 4px;
@@ -1159,8 +1123,10 @@ export default {
box-sizing: border-box; box-sizing: border-box;
} }
.course-card { .course-card {
padding: 30px;
// width: 290px; // width: 290px;
margin-bottom: 15px; margin-bottom: 30px;
margin-right: 36px;
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
background-color: #ffffff; background-color: #ffffff;
@@ -1193,12 +1159,12 @@ export default {
} }
.course-image-box { .course-image-box {
position: relative; position: relative;
// width: 362px; width: 350px;
// height: 165px; height: 200px;
width: 100%; // width: 100%;
.course-image { .course-image {
width: 100%; // width: 100%;
height: 100%; // height: 100%;
// width: 288px; // width: 288px;
// height: 165px; // height: 165px;
} }

3
src/views/portal/course/Index.vue
View File

@@ -87,9 +87,6 @@
<a :href="toCourseDetail(cinfo)"> <a :href="toCourseDetail(cinfo)">
<div class="course-image-box" style="height:196px"> <div class="course-image-box" style="height:196px">
<course-image height="196px" :course="cinfo"></course-image> <course-image height="196px" :course="cinfo"></course-image>
<!-- <span v-if="cinfo.type < 21" class="course-type-title course-type">录播课</span>
<span v-if="cinfo.type==30" class="course-type-title course-type">线下课</span>
<span v-if="cinfo.type==40" class="course-type-title course-type">学习项目</span> -->
</div> </div>
<div :title="cinfo.title" class="course-title two-line-ellipsis" v-html="cinfo.name"> <div :title="cinfo.title" class="course-title two-line-ellipsis" v-html="cinfo.name">
</div> </div>