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

课程学习，右边高度随着内容变化自动变化

Browse Source
This commit is contained in:
daihh
2022-10-17 21:26:31 +08:00
parent 97cf914727 a56f74ae21
commit 94d7615a61
5 changed files with 81 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/Article/editItems.vue
View File

@@ -2,11 +2,10 @@
<div> <div>
<el-row class="article-add"> <el-row class="article-add">
<el-form ref="form" :rules="rules" :model="addForm" label-position="right" label-width="80px"> <el-form ref="form" :rules="rules" :model="addForm" label-position="right" label-width="80px">
<el-form-item prop="title" label="标题:"> <el-form-item prop="title" label="标题">
<el-input class="title-input" v-model.trim="addForm.title" placeholder="请输入文章标题,长度在 1 到 100 个字符" show-word-limit maxlength="100"></el-input> <el-input class="title-input" v-model.trim="addForm.title" placeholder="请输入文章标题,长度在 1 到 100 个字符" show-word-limit maxlength="100"></el-input>
</el-form-item> </el-form-item>
<el-form-item class="imgInstructions"> <el-form-item class="imgInstructions" label="封面">
<div class="el-form-item__content"> <div class="el-form-item__content">
<imageUpload :value="converImage" width="133px" height="100px" @success="handleUploadSuccess" @remove="handleRemoveSuccess"></imageUpload> <imageUpload :value="converImage" width="133px" height="100px" @success="handleUploadSuccess" @remove="handleRemoveSuccess"></imageUpload>
<dl> <dl>
@@ -17,17 +16,24 @@
</div> </div>
</el-form-item> </el-form-item>
<el-form-item prop="keyword" label="关键字:"><el-input show-word-limit maxlength="50" placeholder="请输入关键字,长度在 0 到 50 个字符" v-model.trim="addForm.keyword"></el-input></el-form-item> <el-form-item prop="keyword" label="关键字"><el-input show-word-limit maxlength="50" placeholder="请输入关键字,长度在 0 到 50 个字符" v-model.trim="addForm.keyword"></el-input></el-form-item>
<el-form-item prop="summary" label="摘要:"> <el-form-item prop="summary" label="摘要">
<el-input show-word-limit maxlength="200" placeholder="请输入摘要,仅限200字以内(未填写摘要信息时，自动从内容中提取!)" v-model.trim="addForm.summary" type="textarea" :autosize="{ minRows: 4, maxRows: 6 }"></el-input> <el-input show-word-limit maxlength="200" placeholder="请输入摘要,仅限200字以内(未填写摘要信息时，自动从内容中提取!)" v-model.trim="addForm.summary" type="textarea" :autosize="{ minRows: 4, maxRows: 6 }"></el-input>
</el-form-item> </el-form-item>
<el-form-item prop="content" label="内容:"> <el-form-item prop="content" label="正文">
<WxEditor v-model.trim="addForm.content" placeholder="请输入内容,长度至少在100个字符" :minHeight="250"> <WxEditor v-model.trim="addForm.content" placeholder="请输入内容,长度至少在100个字符" :minHeight="250">
</WxEditor></el-form-item> </WxEditor></el-form-item>
<el-form-item class="footer-btn"> <el-form-item class="footer-btn ">
<el-button type="primary" :loading="craftLoading" @click="submit(1)" style="margin-right: 40px;">保存草稿</el-button> <div class="btnbox">
<div class="check-right">
<el-checkbox style="margin-left:00px" v-model="checked"></el-checkbox><span style="font-size:14px;color:#787878;margin-left: 10px;">我已阅读并遵守<span style="color:#588afc;margin-right:10px;cursor: pointer;" @click="addFormCheckedShow = true">平台内容发布要求</span> </span>
</div>
<div class="button-left">
<el-button type="primary" plain :loading="craftLoading" @click="submit(1)" style="margin-right: 40px;">保存草稿</el-button>
<el-button :loading="loading" @click="submit(2)" :disabled="!checked" type="primary">提交</el-button> <el-button :loading="loading" @click="submit(2)" :disabled="!checked" type="primary">提交</el-button>
<el-checkbox style="margin-left:20px" v-model="checked"></el-checkbox><span style="font-size:14px;color:#787878;margin-left: 10px;">我已阅读并遵守<span style="color:#588afc;margin-right:10px;cursor: pointer;" @click="addFormCheckedShow = true">平台内容发布要求</span> </span> </div>
</div>
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-row> </el-row>
@@ -220,6 +226,21 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.btnbox{
display: flex;
width: 100%;
.check-right{
flex: 1;
}
.button-left{
margin-left: auto;
}
}
::v-deep .el-form-item__label{
font-size: 18px !important;
color: #333 !important;
font-weight: 600 !important;
}
::v-deep .checked-show{ ::v-deep .checked-show{
.el-dialog__header{ .el-dialog__header{
padding:0; padding:0;
@@ -284,8 +305,8 @@ export default {
margin-left: 20px; margin-left: 20px;
line-height: 1.5; line-height: 1.5;
dt { dt {
font-size: 16px; font-size: 18px;
font-weight: bold; font-weight: 600;
} }
dd { dd {
margin: 0; margin: 0;

11
src/components/PortalFooter.vue
View File

@@ -1,8 +1,13 @@
<template> <template>
<div class="portal-footer" :style="`background-image:url(${this.webBaseUrl}/images/bg_foot.png)`"> <div class="portal-footer" >
<!-- :style="`background-image:url(${this.webBaseUrl}/images/bg_foot.png)`" -->
<div class="center"> <div class="center">
<div class="center-img1" style="margin-left: 100px;"><img :src="`${this.webBaseUrl}/images/foot_center.png`"/> </div> <div class="center-img1" style="margin-left: 100px;">
<div class="center-img2"><img :src="`${this.webBaseUrl}/images/foot_code.png`"/> </div> <!-- <img :src="`${this.webBaseUrl}/images/foot_center.png`"/> -->
</div>
<div class="center-img2">
<!-- <img :src="`${this.webBaseUrl}/images/foot_code.png`"/> -->
</div>
</div> </div>
</div> </div>
</template> </template>

2
src/utils/xpage.js
View File

@@ -1,6 +1,6 @@
/**页面设置的一些常量,方便，用于一个处理只写一处，不要多处写*/ /**页面设置的一些常量,方便，用于一个处理只写一处，不要多处写*/
const constants={ const constants={
fileBaseUrl:'http://192.168.0.10/pc/cdn/upload', fileBaseUrl:'http://192.168.0.11/cdn/upload',
newLoginKey:'boe_new_login' newLoginKey:'boe_new_login'
} }

29
src/views/study/coursenew.vue
View File

@@ -46,6 +46,7 @@
</div> </div>
</div> </div>
<div v-if="!scoreInfo.has" class="player-rate"> <div v-if="!scoreInfo.has" class="player-rate">
<el-rate v-model="scoreInfo.score" text-color="#ff9900" score-template="{value}" void-color="#fff" @change="addScore"></el-rate> <el-rate v-model="scoreInfo.score" text-color="#ff9900" score-template="{value}" void-color="#fff" @change="addScore"></el-rate>
</div> </div>
<div v-if="scoreInfo.has" style="padding-top: 5px;display: flex;"> <div v-if="scoreInfo.has" style="padding-top: 5px;display: flex;">
@@ -116,6 +117,7 @@
</div> </div>
<!-- 课程单元 --> <!-- 课程单元 -->
<div class="course-units" v-if="tab == 1"> <div class="course-units" v-if="tab == 1">
<div :style="`height: ${controlHeight}px;overflow-y: auto;`"> <div :style="`height: ${controlHeight}px;overflow-y: auto;`">
<div class="catalog" v-if="courseInfo.type == 20"> <div class="catalog" v-if="courseInfo.type == 20">
<div v-for="(item, index) in catalogTree" :key="index" :name="index"> <div v-for="(item, index) in catalogTree" :key="index" :name="index">
@@ -178,8 +180,7 @@
<div class="teacher" v-for="(item, idx) in teachers" :key="idx"> <div class="teacher" v-for="(item, idx) in teachers" :key="idx">
<div class="teacher-avator"> <div class="teacher-avator">
<!-- <div class="teacher-text" v-if="item.authorInfo.avatar == ''">{{userAvatarText(item.teacherName)}}</div> --> <!-- <div class="teacher-text" v-if="item.authorInfo.avatar == ''">{{userAvatarText(item.teacherName)}}</div> -->
<div v-if="item.authorInfo.avatar !== ''">
<el-avatar :src="fileBaseUrl + item.authorInfo.avatar" shape="circle" :size="50"></el-avatar>
</div> </div>
<div v-else class="teacher-text"> <div v-else class="teacher-text">
<div v-if="item.authorInfo.sex === 1 "><img src="../../../public/images/Avatarman.png" alt=""></div> <div v-if="item.authorInfo.sex === 1 "><img src="../../../public/images/Avatarman.png" alt=""></div>
@@ -306,7 +307,7 @@
totalContent: 0, //课程内容数量 totalContent: 0, //课程内容数量
pageCount: 0, pageCount: 0,
currentPage: 0, currentPage: 0,
fileBaseUrl: this.$xpage.constants.fileBaseUrl, fileBaseUrl: process.env.VUE_APP_FILE_BASE_URL,
contentList: [], contentList: [],
sectionList: [], sectionList: [],
teachers: [], teachers: [],
@@ -340,13 +341,7 @@
this.$watermark.set(this.userInfo.name + this.userInfo.loginName); this.$watermark.set(this.userInfo.name + this.userInfo.loginName);
this.courseId = this.$route.query.id; this.courseId = this.$route.query.id;
this.loadData(); this.loadData();
var $this = this;
// window.onresize = function(){ // 定义窗口大小变更通知事件
// let w2=$this.$refs.coursePlayer.offsetWidth;
// //按高度
// $this.controlHeight=w2*(9/16);
// //console.log(w,w2,'区域的高茺');
// };
}, },
computed: { computed: {
...mapGetters(['userInfo']), ...mapGetters(['userInfo']),
@@ -385,11 +380,16 @@
}, },
methods: { methods: {
Fn1(){ Fn1(){
<<<<<<< .mine
//console.log('子组件发生变化'); //console.log('子组件发生变化');
// this.componentKey += 1; // this.componentKey += 1;
=======
console.log('子组件发生变化');
// this.componentKey += 1;
>>>>>>> .theirs
// this.$forceUpdate(); // this.$forceUpdate();
// window.location.reload() // window.location.reload()
// this.coutab(3);
this.timer = new Date().getTime() this.timer = new Date().getTime()
}, },
@@ -782,6 +782,9 @@
res.result.some(author => { res.result.some(author => {
if (author.aid == item.teacherId) { if (author.aid == item.teacherId) {
item.authorInfo = author; item.authorInfo = author;
if(author.avatar){
item.avatar=this.fileBaseUrl + author.avatar;
}
return true; return true;
} else { } else {
return false; return false;
@@ -1300,6 +1303,7 @@
//内容块样式定义 //内容块样式定义
.course-content { .course-content {
min-height: 745px; min-height: 745px;
margin: 20px auto; margin: 20px auto;
.course-playbox { .course-playbox {
background-color: #fff; background-color: #fff;
@@ -1309,6 +1313,7 @@
.course-player{ //内容播放区域 .course-player{ //内容播放区域
flex:1; flex:1;
min-width: 700px; min-width: 700px;
min-height: 500px; min-height: 500px;
height: 100%; height: 100%;
border: 1px solid #ffffff; border: 1px solid #ffffff;
@@ -1327,6 +1332,7 @@
.course-info { .course-info {
flex:1; flex:1;
min-width: 700px; min-width: 700px;
min-height: 710px; min-height: 710px;
box-sizing: border-box; box-sizing: border-box;
padding-right: 20px; padding-right: 20px;
@@ -1549,6 +1555,7 @@
} }
.con-audio-player { .con-audio-player {
padding: 50px 50px; padding: 50px 50px;
} }
} }

29
src/views/user/ranking.vue
View File

@@ -86,7 +86,10 @@
</div> </div>
<div class="jy tab-jy"> <div class="jy tab-jy">
<div style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{experience.data.total}}</div> <div v-if="experience.field == 'total'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{experience.data.total}}</div>
<div v-if="experience.field == 'months'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{experience.data.months}}</div>
<div v-if="experience.field == 'years'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{experience.data.years}}</div>
<div v-if="experience.field == 'weeks'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{experience.data.weeks}}</div>
</div> </div>
</div> </div>
@@ -144,7 +147,10 @@
</div> </div>
</div> </div>
<div class="jy tab-jy"> <div class="jy tab-jy">
<div style="font-size: 18px;color: #333333;font-weight: 600;">{{lan.total}}</div> <div v-if="learningDuration.field == 'total'" style="font-size: 18px;color: #333333;font-weight: 600;">{{lan.total}}</div>
<div v-if="learningDuration.field == 'months'" style="font-size: 18px;color: #333333;font-weight: 600;">{{lan.months}}</div>
<div v-if="learningDuration.field == 'years'" style="font-size: 18px;color: #333333;font-weight: 600;">{{lan.years}}</div>
<div v-if="learningDuration.field == 'weeks'" style="font-size: 18px;color: #333333;font-weight: 600;">{{lan.weeks}}</div>
</div> </div>
</div> </div>
</div> </div>
@@ -161,7 +167,10 @@
</div> </div>
</div> </div>
<div class="jy tab-jy"> <div class="jy tab-jy">
<div style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDuration.data.total}}</div> <div v-if="learningDuration.field == 'total'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDuration.data.total}}</div>
<div v-if="learningDuration.field == 'months'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDuration.data.months}}</div>
<div v-if="learningDuration.field == 'years'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDuration.data.years}}</div>
<div v-if="learningDuration.field == 'weeks'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDuration.data.weeks}}</div>
</div> </div>
</div> </div>
</div> </div>
@@ -218,7 +227,10 @@
</div> </div>
<div class="jy tab-jy"> <div class="jy tab-jy">
<div style="font-size: 18px;color: #333333;font-weight: 600;">{{day.total}}</div> <div v-if="learningDays.field == 'total'" style="font-size: 18px;color: #333333;font-weight: 600;">{{day.total}}</div>
<div v-if="learningDays.field == 'weeks'" style="font-size: 18px;color: #333333;font-weight: 600;">{{day.weeks}}</div>
<div v-if="learningDays.field == 'months'" style="font-size: 18px;color: #333333;font-weight: 600;">{{day.months}}</div>
<div v-if="learningDays.field == 'years'" style="font-size: 18px;color: #333333;font-weight: 600;">{{day.years}}</div>
</div> </div>
</div> </div>
</div> </div>
@@ -236,7 +248,10 @@
</div> </div>
<div class="jy tab-jy"> <div class="jy tab-jy">
<div style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDays.data.total}}</div> <div v-if="learningDays.field == 'total'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDays.data.total}}</div>
<div v-if="learningDays.field == 'weeks'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDays.data.weeks}}</div>
<div v-if="learningDays.field == 'months'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDays.data.months}}</div>
<div v-if="learningDays.field == 'years'" style="font-size: 18px;color: #333333;font-weight: 600;color: #0059FF;">{{learningDays.data.years}}</div>
</div> </div>
</div> </div>
</div> </div>
@@ -373,7 +388,7 @@ export default {
aid:this.userInfo.aid,// #用户id aid:this.userInfo.aid,// #用户id
statType:10, // #统计类型 10学习时长 11 学习天数 20表经验值 30表u币 40表获取天数 statType:10, // #统计类型 10学习时长 11 学习天数 20表经验值 30表u币 40表获取天数
field:this.learningDuration.field,// #统计周期 todays-当天,weeks-周,months-月,years-年 total-总计 field:this.learningDuration.field,// #统计周期 todays-当天,weeks-周,months-月,years-年 total-总计
num:4,// #显示的条数 num:5,// #显示的条数
} }
apiStat.getRanking(data).then(res=>{ apiStat.getRanking(data).then(res=>{
if(res.status==200){ if(res.status==200){
@@ -411,7 +426,7 @@ export default {
aid:this.userInfo.aid,// #用户id aid:this.userInfo.aid,// #用户id
statType:11, // #统计类型 10学习时长 11 学习天数 20表经验值 30表u币 40表获取天数 statType:11, // #统计类型 10学习时长 11 学习天数 20表经验值 30表u币 40表获取天数
field:this.learningDays.field,// #统计周期 todays-当天,weeks-周,months-月,years-年 total-总计 field:this.learningDays.field,// #统计周期 todays-当天,weeks-周,months-月,years-年 total-总计
num:4,// #显示的条数 num:5,// #显示的条数
} }
apiStat.getRanking(data).then(res=>{ apiStat.getRanking(data).then(res=>{
if(res.status==200){ if(res.status==200){