提交 b4f32f81 编写于 作者: huangwensu's avatar huangwensu

项目详情简介添加组件

上级 cce95516
<template>
<div class="basic-container">
<div class="basic-title">基本信息</div>
<div class="content">
<span>项目名称</span>
<span>GWKX-20180326-42843</span>
</div>
<div class="content">
<span>学习收获</span>
<span>国家级Ⅰ类 3学分</span>
</div>
<div class="content">
<span>申请范围</span>
<span>河北省 石家庄</span>
</div>
<div class="content">
<span>起止时间</span>
<span>2020.03.01至2020.12.3</span>
</div>
<div class="content">
<span>发起机构</span>
<span>云鹊医</span>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.basic-container {
padding-bottom: px2rem(20px);
margin: px2rem(30px) px2rem(15px) 0px;
border-bottom: px2rem(1px) solid #E7E8E9;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
color: #373839;
font-weight: 700;
}
.content {
margin-top: px2rem(16px);
span {
display: inline-block;
font-size: px2rem(14px);
}
span:first-child {
color: #979899;
}
span:last-child {
margin-left: px2rem(15px);
color: #676869;
}
}
}
</style>
\ No newline at end of file
...@@ -30,8 +30,8 @@ export default { ...@@ -30,8 +30,8 @@ export default {
data() { data() {
return { return {
step1: false, step1: false,
step2: false, step2: true,
step3: true, step3: false,
step4: false step4: false
} }
}, },
...@@ -119,12 +119,12 @@ export default { ...@@ -119,12 +119,12 @@ export default {
content: ""; content: "";
width: px2rem(0px); width: px2rem(0px);
height: px2rem(0px); height: px2rem(0px);
border-top: px2rem(6px) solid #449284; border-top: px2rem(5px) solid #449284;
border-left: px2rem(6px) solid transparent; border-left: px2rem(5px) solid transparent;
border-right: px2rem(5px) solid transparent; border-right: px2rem(5px) solid transparent;
position: absolute; position: absolute;
top: px2rem(20px); top: px2rem(20px);
left: px2rem(20px); left: px2rem(22px);
} }
.step2-text { .step2-text {
left: px2rem(106px); left: px2rem(106px);
...@@ -133,8 +133,8 @@ export default { ...@@ -133,8 +133,8 @@ export default {
content: ""; content: "";
width: px2rem(0px); width: px2rem(0px);
height: px2rem(0px); height: px2rem(0px);
border-top: px2rem(6px) solid #449284; border-top: px2rem(5px) solid #449284;
border-left: px2rem(6px) solid transparent; border-left: px2rem(5px) solid transparent;
border-right: px2rem(5px) solid transparent; border-right: px2rem(5px) solid transparent;
position: absolute; position: absolute;
top: px2rem(20px); top: px2rem(20px);
...@@ -147,12 +147,12 @@ export default { ...@@ -147,12 +147,12 @@ export default {
content: ""; content: "";
width: px2rem(0px); width: px2rem(0px);
height: px2rem(0px); height: px2rem(0px);
border-top: px2rem(6px) solid #449284; border-top: px2rem(5px) solid #449284;
border-left: px2rem(6px) solid transparent; border-left: px2rem(5px) solid transparent;
border-right: px2rem(5px) solid transparent; border-right: px2rem(5px) solid transparent;
position: absolute; position: absolute;
top: px2rem(20px); top: px2rem(20px);
left: px2rem(20px); left: px2rem(22px);
} }
.step4-text { .step4-text {
right: px2rem(20px); right: px2rem(20px);
...@@ -161,8 +161,8 @@ export default { ...@@ -161,8 +161,8 @@ export default {
content: ""; content: "";
width: px2rem(0px); width: px2rem(0px);
height: px2rem(0px); height: px2rem(0px);
border-top: px2rem(6px) solid #449284; border-top: px2rem(5px) solid #449284;
border-left: px2rem(6px) solid transparent; border-left: px2rem(5px) solid transparent;
border-right: px2rem(5px) solid transparent; border-right: px2rem(5px) solid transparent;
position: absolute; position: absolute;
top: px2rem(20px); top: px2rem(20px);
......
<template>
<div class="basic-container">
<div class="basic-title">学习须知</div>
<div class="content">
<span>1、必须在该项目页内学完所有课程,平台其它栏目课程进度不计入本项目; </span>
<span>2、该项目每一章节课程必须按顺序学完并参与考试,且首次学习不允许跳过、快进等;学习时长均需达到80%及以上,考试成绩均在80分及以上判定为通过。</span>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
.basic-container {
margin: px2rem(30px) px2rem(15px) px2rem(20px);
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
color: #373839;
font-weight: 700;
}
.content {
margin-top: px2rem(16px);
span {
display: inline-block;
font-size: px2rem(14px);
color: #676869;
}
}
}
</style>
\ No newline at end of file
...@@ -25,14 +25,19 @@ ...@@ -25,14 +25,19 @@
<!-- 步骤条 --> <!-- 步骤条 -->
<CmeStep></CmeStep> <CmeStep></CmeStep>
<!-- 简介和目录 --> <!-- 简介和目录 -->
<van-tabs v-model="active"> <div class="intro-catalogue-container">
<van-tab title="简介"> <div class="title">
<span class="focus">简介</span>
<span>目录</span>
</div>
<div class="intro-content">
<BasicInfo></BasicInfo>
<LearnKnow></LearnKnow>
</div>
<div class="catalogue-content">
</van-tab> </div>
<van-tab title="目录"> </div>
</van-tab>
</van-tabs>
<CommonSpliteLine></CommonSpliteLine> <CommonSpliteLine></CommonSpliteLine>
<CertShow v-if="projectStatus === 2"></CertShow> <CertShow v-if="projectStatus === 2"></CertShow>
<CellListDetail v-if="visibleFlag == 1" :projectComponent="projectComponentDTOS" :paramData="contentList" :moduleName="moduleName" :actionList="actionList" :detailNum="detailNum" :courseRequire="courseRequire"></CellListDetail> <CellListDetail v-if="visibleFlag == 1" :projectComponent="projectComponentDTOS" :paramData="contentList" :moduleName="moduleName" :actionList="actionList" :detailNum="detailNum" :courseRequire="courseRequire"></CellListDetail>
...@@ -59,6 +64,8 @@ import vueFilters from '@/utils/filter'; ...@@ -59,6 +64,8 @@ import vueFilters from '@/utils/filter';
// import PopNotice from "@/components/business/pop-notice"; // import PopNotice from "@/components/business/pop-notice";
// import NoticeItem from "@/components/business/notice-item"; // import NoticeItem from "@/components/business/notice-item";
import CmeStep from "@/components/cme/cme-step"; import CmeStep from "@/components/cme/cme-step";
import BasicInfo from "@/components/cme/basic-info";
import LearnKnow from "@/components/cme/learn-know";
export default { export default {
data() { data() {
...@@ -89,7 +96,7 @@ export default { ...@@ -89,7 +96,7 @@ export default {
projectName: "", projectName: "",
attachmentUrl: require("../images/banner-default.png"), attachmentUrl: require("../images/banner-default.png"),
bgColor: "none", bgColor: "none",
navTitle: "", navTitle: "项目详情",
compTitle: "组件名称", compTitle: "组件名称",
isShowNavbar: true, isShowNavbar: true,
isFixNavbar: true, isFixNavbar: true,
...@@ -126,7 +133,9 @@ export default { ...@@ -126,7 +133,9 @@ export default {
CommonBannerVideo, CommonBannerVideo,
Loading, Loading,
CommonTcPlayer, CommonTcPlayer,
CmeStep CmeStep,
BasicInfo,
LearnKnow
}, },
computed: { computed: {
...mapGetters(["userInfo"]) ...mapGetters(["userInfo"])
...@@ -402,38 +411,66 @@ export default { ...@@ -402,38 +411,66 @@ export default {
<style lang="scss" > <style lang="scss" >
@import "../style/mixin"; @import "../style/mixin";
.page-container-merge { .page-container-merge {
.nav-top .nav-title { .nav-top .nav-title {
height: px2rem(0px); height: px2rem(0px);
padding: px2rem(18px); padding: px2rem(18px);
}
.banner-img {
display: inherit;
width: px2rem(375px);
height: px2rem(210px);
&-1 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
} }
&-5 { .banner-img {
position: absolute; display: inherit;
left: 0; width: px2rem(375px);
top: px2rem(180px); height: px2rem(210px);
width: px2rem(76px); &-1 {
height: px2rem(30px); position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
}
&-5 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
}
&-10 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(148px);
height: px2rem(30px);
}
} }
&-10 { .list-container {
position: absolute; // margin-bottom: px2rem(40px);
left: 0; }
top: px2rem(180px); .intro-catalogue-container {
width: px2rem(148px); .title {
height: px2rem(30px); height: px2rem(50px);
line-height: px2rem(50px);
padding: 0 px2rem(15px);
border-bottom: 1px solid #F0F1F2;
span {
display: inline-block;
font-size: px2rem(15px);
color: #979899;
padding-right: px2rem(35px);
}
span.focus {
color: #373839;
position: relative;
}
span.focus:after {
content: "";
position: absolute;
background: #449284;
border: 1px solid #449284;
bottom: px2rem(6px);
width: px2rem(10px);
height: px2rem(2px);
left: px2rem(7px);
}
}
} }
}
.list-container {
// margin-bottom: px2rem(40px);
}
} }
</style> </style>
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册