Skip to content

P
pica-professional-exam
提交 0ff27d72 编写于 作者: guofeng.chen's avatar guofeng.chen
浏览文件
操作

Merge branch 'dev-coursedetail-0817' of... 

Merge branch 'dev-coursedetail-0817' of http://192.168.110.53/com.pica.cloud.education.frontend/pica-professional-exam into dev-coursedetail-0817
上级 347c8657 1e48a81e
隐藏空白字符变更
内嵌 并排
正在显示 包含 331 行增加 和 11 行删除
src/components/course/brief-intro.vue 0 → 100644
浏览文件 @ 0ff27d72
<template>
<div class="brief-intro-wrapper">
<TeacherIntro :doctorList="doctorList"></TeacherIntro>
<CourseIntro></CourseIntro>
<CourseHarvest></CourseHarvest>
</div>
</template>
<script>
import TeacherIntro from "@/components/course/course-teacher";
import CourseIntro from "@/components/course/course-intro";
import CourseHarvest from "@/components/course/course-harvest";
export default {
components: {
TeacherIntro,
CourseIntro,
CourseHarvest,
},
data() {
return {
doctorList: [
{
id: 973,
name: "左力",
appImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
avatarImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
hospital: "北京大学人民医院",
title: "主任医师",
info: ""
},
{
id: 973,
name: "左力",
appImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
avatarImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
hospital: "北京大学人民医院",
title: "主任医师",
info: ""
},
]
};
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.brief-intro-wrapper {
}
</style>
\ No newline at end of file
src/components/course/common-title.vue 0 → 100644
浏览文件 @ 0ff27d72
<template>
<span class="common-title-wrapper">{{title}}</span>
</template>
<script>
export default {
props: {
title: {
type: String,
default: "课程简介"
}
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.common-title-wrapper {
display: inline-block;
height: px2rem(18px);
line-height: px2rem(18px);
margin: px2rem(30px) px2rem(15px) px2rem(15px);
font-size: px2rem(18px);
font-weight: 700;
color: #373839;
}
</style>
\ No newline at end of file
src/components/course/course-covers.vue
浏览文件 @ 0ff27d72
......@@ -62,5 +62,10 @@ export default {
text-align: center;
font-size: px2rem(15px);
}
.course-button-group {
display: flex;
align-items: center;
justify-content:center;
}
}
</style>
\ No newline at end of file
src/components/course/course-harvest.vue 0 → 100644
浏览文件 @ 0ff27d72
<template>
<div class="course-harvest-wrapper">
<CommonTitle :title="title"></CommonTitle>
<ul class="list-wrapper">
<li class="item">
<span class="name">卫计委《基层全科诊断资质》证书</span>
<span class="btn">查看</span>
</li>
<li class="item">
<span class="name">卫计委《基层全科诊断资质》证书</span>
<span class="btn">查看</span>
</li>
<li class="item">
<span class="name">卫计委《基层全科诊断资质》证书</span>
<span class="btn">查看</span>
</li>
</ul>
</div>
</template>
<script>
import CommonTitle from "@/components/course/common-title"
export default {
components: {
CommonTitle
},
data() {
return {
title: "学习收获"
}
},
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.course-harvest-wrapper {
.list-wrapper {
.item {
display: flex;
justify-content: space-between;
height: px2rem(65px);
line-height: px2rem(65px);
margin: 0 px2rem(15px);
align-items: center;
border-bottom: 1px solid #E7E8E9;
.name {
font-size: px2rem(15px);
font-weight: 700;
color: #333333;
}
.btn {
display: inline-block;
height: px2rem(25px);
line-height: px2rem(25px);
font-size: px2rem(12px);
font-weight: 700;
padding: 0 px2rem(18px);
color: #449284;
border-radius: px2rem(15px);
border:1px solid rgba(68, 146, 132, 0.45);
}
}
}
}
</style>
\ No newline at end of file
src/components/course/course-intro.vue 0 → 100644
浏览文件 @ 0ff27d72
<template>
<div class="course-intro-wrapper">
<CommonTitle></CommonTitle>
<div class="body">
<span class="content" :class="{'ellipsis': isUp}">{{content}}</span>
<div class="toggle-btn" @click="isUp=!isUp">
<span class="action">{{ isUp ? "详情" : "收起"}}</span>
<img v-show="isUp" src="../../images/down.png" alt="">
<img v-show="!isUp" src="../../images/up.png" alt="">
</div>
</div>
</div>
</template>
<script>
import CommonTitle from "@/components/course/common-title"
export default {
components: {
CommonTitle
},
props: {
content: {
type: String,
default: "本课程从三级本课程从三级本课程从1级本课课程从三级本课程从1级本课课程从三级本课程从1级本课程从三级本本课程本课b从三级本课程从三级本课程从1级本课程从三级本课程从三级本课程从三级"
}
},
data() {
return {
isUp: true
}
},
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.course-intro-wrapper {
.body {
position: relative;
color: #676869;
font-size: px2rem(14px);
padding: 0 px2rem(15px);
.content {
display: block;
text-align: justify;
&.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
white-space: normal;
}
}
.toggle-btn {
// background: #fff;
position: absolute;
right: px2rem(15px);
bottom: 0;
display: flex;
align-items: center;
padding-left: px2rem(30px);
background: -webkit-linear-gradient(left, transparent, #fff 30%);
img {
position: relative;
top: px2rem(1px);
margin-left: px2rem(6px);
width: px2rem(12px);
height: px2rem(7px);
}
.action {
color: #449284;
}
}
}
}
</style>
\ No newline at end of file
src/components/course/course-teacher.vue 0 → 100644
浏览文件 @ 0ff27d72
<template>
<div class="course-teacher-wrapper">
<div class="basic-title">讲师介绍</div>
<div class="leader-info" v-for="(item,index) in doctorList" :key="index">
<img :src="item.appImageUrl"/>
<div class="leader-text">
<div class="leader-con">
<span>{{item.name}}</span>
<span class="leader-title">{{item.title}}</span>
</div>
<div class="hospital">{{item.hospital}}</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
doctorList: {
type: Array,
default: () => []
}
},
data() {
return {
}
},
created() {
},
mounted() {
},
methods: {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.course-teacher-wrapper {
padding: px2rem(30px) px2rem(15px) 0px;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
color: #373839;
font-weight: 700;
}
.leader-info {
display: flex;
flex-direction: row;
margin-top: px2rem(16px);
padding-bottom: px2rem(16px);
border-bottom: 1px solid #E7E8E9;
img {
display: inline-block;
width: px2rem(44px);
height: px2rem(44px);
border-radius: 50%;
}
.leader-text {
margin-left: px2rem(16px);
margin-top: px2rem(6px);
.leader-con {
line-height: px2rem(14px);
display: flex;
flex-direction: row;
span {
font-size: px2rem(16px);
color: #676869;
}
span:first-child {
font-size: px2rem(16px);
color: #373839;
font-weight: 700;
line-height: 1.1;
}
.leader-title {
width: px2rem(220px);
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
line-height: px2rem(16px);
margin-left: px2rem(6px);
}
}
.hospital {
margin-top: px2rem(5px);
font-size: px2rem(13px);
color: #979899;
width: px2rem(240px);
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
}
}
}
</style>
\ No newline at end of file
src/style/global.scss
浏览文件 @ 0ff27d72
......@@ -179,9 +179,4 @@
font-size: 17px;
color: #449284;
}
}
.course-button-group {
display: flex;
align-items: center;
justify-content:center;
}
\ No newline at end of file
src/views/test-components.vue
浏览文件 @ 0ff27d72
......@@ -15,8 +15,9 @@
<CourseButton type="plain"></CourseButton>
<CourseButton></CourseButton>
</div> -->
<CourseCovers></CourseCovers>
<!-- <CourseCovers></CourseCovers> -->
<!-- <div @click="testDialog">testDialog</div> -->
<BriefIntro></BriefIntro>
</div>
</template>
<script>
......@@ -26,6 +27,7 @@ import CommonBottomInfo from "@/components/cme/common-bottom-info";
import CommonErrorTips from "@/components/course/common-error-tips";
import CourseButton from "@/components/course/course-button";
import CourseCovers from "@/components/course/course-covers";
import BriefIntro from "@/components/course/brief-intro";
export default {
data() {
......@@ -37,13 +39,14 @@ export default {
// CommonButton,
// CommonDialog,
// CommonBottomInfo,
CommonErrorTips,
CourseButton,
CourseCovers
// CommonErrorTips,
// CourseButton,
// CourseCovers,
BriefIntro
},
mounted() {
// Toast
this.$toast({message: '展示图片', duration: 3000 });
// this.$toast({message: '展示图片', duration: 3000 });
},
beforeDestroyed() {},
......@@ -68,7 +71,7 @@ export default {
<style lang="scss" scoped>
@import "../style/mixin";
.test-container {
background: rgba($color: #000000, $alpha: 0.8);
// background: rgba($color: #000000, $alpha: 0.8);
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或