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

修改个人中心

Browse Source
This commit is contained in:
lmj
2022-10-11 17:54:04 +08:00
parent eb161db619
commit 2ddfcf1a45
3 changed files with 109 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
src/components/Course/collectItem.vue
View File

@@ -2,23 +2,30 @@
<div style="cursor: pointer;">
<div class="uc-course" v-for="(item, idx) in items" :key="idx" @click="coudetail(item)">
<div class="uc-course-img" style="width: 212px;height: 119px;" @click="jump(item)">
<div class="uc-course-img" style="width: 212px;height: 119px;margin-right:23px;" @click="jump(item)">
<course-image :course="item"></course-image>
<!-- <img :src="imageUrl(item)" /><span v-if="isShow" class="two-line-ellipsis">{{item.title}}</span> -->
<span class="course-type">{{ contentTypeFilter(item.contentType).text }}</span>
</div>
<div class="flex-between" @click="jump(item)">
<div class="uc-course-name one-line-ellipsis">
<span :class="contentTypeFilter(item.contentType).class">{{ contentTypeFilter(item.contentType).text }}</span>
<span>{{ item.title }}</span>
</div>
<div class="uc-course-text">讲师：{{ item.authorName}}</div>
<div class="uc-course-text">收藏时间：{{ item.time || item.favoritesTime}}</div>
</div>
<div class="flex-between">
<el-button v-if="remove" @click.stop="delItem(item)" type="text" icon="el-icon-remove" style="color:#8590A6;font-size:14px;">
<div class="uc-course-name ">
<div class="uc-coures-name-left one-line-ellipsis">
<span >{{ item.title }} <span class="bq-coures">#课程#</span> </span>
</div>
<div class="canfavo">
<el-button v-if="remove" @click.stop="delItem(item)" type="text" icon="el-icon-star-on" style="color:#8590A6;">
取消收藏
</el-button>
</div>
</div>
<div class="uc-bpttom">
<div class="uc-course-text"> <i class="el-icon-time"></i> 报名时间：{{ item.time || item.favoritesTime}}</div>
<div class="uc-coures-button">
<el-button type="primary">去上课</el-button>
</div>
</div>
</div>
<!-- <div class="uc-course-info">
<div style="display: flex;justify-content: space-between;">
<router-link target="_blank" :to="'/course/detail?id='+item.objId" class="uc-course-name">
@@ -137,6 +144,46 @@ export default {
</script>
<style lang="scss" scoped>
.bq-coures{
font-size: 16px;
color: #333333;
margin-left: 5px;
}
.uc-bpttom{
display: flex;
.uc-coures-button{
margin-left: auto;
margin-top: 55px;
}
}
.uc-course-text{
flex: 1;
font-size: 14px;
color: #666666;
margin-top: 70px;
}
.course-type {
position: absolute;
top: 0px;
right: 0px;
width: 60px;
height: 24px;
line-height: 24px;
text-align: center;
background-color: #f99000;
border-radius: 2px 4px 0px 14px;
font-size: 12px;
color: #ffffff;
-moz-user-select: none;
/*火狐*/
-webkit-user-select: none;
/*webkit浏览器*/
-ms-user-select: none;
/*IE10*/
-khtml-user-select: none;
/*早期浏览器*/
user-select: none;
}
.one-line-ellipsis{
display: -webkit-box;
@@ -157,26 +204,7 @@ export default {
padding-left: 0px;
padding-bottom: 20px;
padding-top: 15px;
// margin-bottom: 10px;
// margin-left: 10px;
.flex-between {
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 10px;
.uc-course-text {
color: #747474;
margin-right: 20px;
}
&:last-of-type{
margin-left: auto;
justify-content: flex-end;
}
// &:last-of-type {
// align-items: flex-start;
// }
}
.uc-course-img {
position: relative;
::v-deep img {
@@ -184,21 +212,26 @@ export default {
height: 119px;
border: 1px solid #f4f4f5;
}
> span {
position: absolute;
top: 30px;
left: 10px;
width: 100%;
height: 100%;
color: #ffffff;
font-size: 16px;
}
}
.flex-between{
flex: 1;
}
.uc-course-name {
font-size: 16px;
font-weight: 400;
> span:last-of-type {
margin-left: 8px;
display: flex;
width: 100%;
line-height: 30px;
height: 30px;
.uc-coures-name-left{
flex: 1;
}
.canfavo{
margin-left:auto;
width: 100px;
button{
font-size: 12px;
}
}
}
}