Skip to content

P
pica-professional-exam
提交 9f03cc32 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

新需求部分改动

上级 f54e9e4c
隐藏空白字符变更
内嵌 并排
正在显示 包含 645 行增加 和 7 行删除
src/components/business/cell-list-detail copy.vue 0 → 100644
浏览文件 @ 9f03cc32
<template>
<!-- 项目组件列表项 -->
<section>
<div
class="cell-detail"
v-for="(component , index) in projectComponent"
:key="index">
<!-- <CommonTitle :fontWeight="500" :title="component.name" :isShowCert="true" :isShowExplain="true" @showDialog="showDialog(component.introduce)"></CommonTitle> -->
<!-- <MergeTitle :fontWeight="500" :title="component.name" :isShowCert="component.status" :isShowExplain="true" @showDialog="showDialog(component.introduce)"></MergeTitle> -->
<van-collapse v-model="activeNames" @change="changeCollapse">
<van-collapse-item
v-for="(portalModule, index) in component.portalModuleDTOS"
:key="index"
:title="(parseInt(index) + 1) + '.' + portalModule.moduleName | shortName(19)"
:name="portalModule.expandKey"
:value="portalModule.value"
:disabled="portalModule.disabled"
@click.native="chooseItem(portalModule)"
>
<!-- @click.native="chooseItem(item)" -->
<article @click.stop="deleteFlow()" class="cell-container">
<span class="" v-for="(item, index) in portalModule.contentList" :key="index">
<div v-if="index > 0 && portalModule.contentList[index].templetId!= portalModule.contentList[index-1].templetId" class="bottom-line"></div>
<div class="cell-container-item" >
<div class="name">
<div class="name-img">
<img v-if="item.type == 1 && item.useFlag == 1" class="img-icon" src="../../images/exam.png">
<img v-if="item.type == 1 && item.useFlag == 2" class="img-icon" src="../../images/exam-dark.png">
<img v-if="item.type == 2 && item.useFlag == 1" class="img-icon" src="../../images/learn.png">
<img v-if="item.type == 2 && item.useFlag == 2" class="img-icon" src="../../images/learn-dark.png">
</div>
<p class="name-title" :class="{'name-title-no': item.useFlag == 2}">{{item.name | shortName(30)}}</p>
</div>
<span
@click="gotoExamOrCourse(item)"
v-show="hasBindCard"
class="text-action"
:class="{'text-action-no': item.useFlag == 2}"
>
{{getActionText(item.status)}}
</span>
<img @click="toastToBuy" class="key" v-show="!hasBindCard" src="../../images/cme/phrase2/key.png" alt="">
<div class="foot-line"
v-if="index+1 < portalModule.contentList.length && portalModule.contentList[index].templetId == portalModule.contentList[index+1].templetId">
</div>
</div>
<span v-if="item.certificateFlag == 2">
<img class="cert-img" :class="{'space2': item.height == 2 }" src="../../images/has-cert-new.png">
</span>
</span>
</article>
</van-collapse-item>
</van-collapse>
</div>
<van-dialog
v-model="dialogState"
title="标题"
>
</van-dialog>
</section>
</template>
<script>
import MergeTitle from "@/components/business/merge-title";
import NoMoreContent from "@/components/business/no-more-content";
import CertShow from "@/components/business/cert-show";
import { Collapse, CollapseItem, Dialog, Toast } from 'vant';
import { mapGetters } from "vuex";
import { getAppVersion } from "@/utils";
import vueFilters from '@/utils/filter';
const actionMap = {
11: "去考试",
12: "再考一次",
13: "已通过",
14: "已完成",
15: "已通过",
16: "未通过",
21: "去学习",
22: "继续学习",
23: "去复习"
};
const sendBuriedDataMap = {
// 11: "8824",
// 12: "211013",
21: "8821",
22: "8822",
23: "8823"
}
export default {
name: "cell-list-item",
data() {
return {
appVersion: "200",
hocImg: require("../../images/has-owner-cert.png"),
activeNames: [1],
dialogState: false,
projectId: 1
};
},
props: {
hasBindCard: {
type: Boolean,
default: false
},
projectComponent: {
type: Array,
default: () => []
},
actionList: {
type: Array,
default: () => []
},
detailNum: {
type: Number | String,
default: 0
},
courseRequire: {
type: Number | String,
default: 0,
}
},
computed: {
...mapGetters(["userInfo"])
},
components: {
MergeTitle,
CertShow,
NoMoreContent,
Dialog,
},
watch:{
actionList: {
immediate: true,
handler (val) {
this.activeNames = val;
}
}
},
mounted() {
},
created() {
this.projectId = this.$route.query.id;
},
methods: {
// 跳转到考试或课程 type 1: 考试; 2: 课程
// 如果是考试，将根据appVersion判断是新考试还是老考试，如果是301或之前的，都是老考试
gotoExamOrCourse(item) {
// 埋点：去学习、继续学习、复习、去考试、重考
let actionCode = sendBuriedDataMap[item.status];
if(actionCode) {
this.$sendBuriedData({
component_tag: `882#${actionCode}#${this.projectId}`
});
}
let appVersion = getAppVersion(this.userInfo.appVersion);
if (item.useFlag == 2) return;
if (window.__isWeb) {
// this.$refs.toastTitle.toast("请您下载App");
Toast('请您下载App');
return;
}
if (item.type == 1) {
if (appVersion <= 300) {
// this.$refs.toastTitle.toast("请您下载新版本App");
Toast('请您下载新版本App');
return;
} else {
this.gotoExam(item.id);
}
} else if (item.type == 2) {
this.gotoCourse(item.id);
}
},
// 跳转到课程
gotoCourse: function(courseId) {
let paramList = []
paramList = [
{
key: "className",
value: "com.picahealth.yunque.activitys.courseplaynew.MyTcPlayVideoActivity###CourseMultiMediaPlayController",
type: 4,
seqNo: 1
},
{
key: "isCHC",
value: 0,
type: 4,
seqNo: 1
},
{
key: "courseId",
value: courseId,
type: 4,
seqNo: 1
},
{
key: "courseRequire",
value: this.courseRequire - 0,
type: 4,
seqNo: 1
},
];
rocNative.dispatchEventByModuleCode({
modeCode: "M200",
jsonString: paramList
});
},
// 跳转到考试
gotoExam: function(examId) {
let paramList = [
{
key: "className",
value:
"com.picahealth.yunque.activitys.exammodule.ExamPreActivity###PicaDo.ExamModuleManager",
type: 4,
seqNo: 1
},
{
key: "examId",
value: examId,
type: 4,
seqNo: 1
}
];
rocNative.dispatchEventByModuleCode({
modeCode: "M200",
jsonString: paramList
});
},
getActionText(status) {
return actionMap[status];
},
// showDialog(introduce) {
// Dialog.alert({
// title: '说明',
// message: introduce,
// confirmButtonText: '我知道了',
// })
// },
changeCollapse(activeNames) {
console.log('activeNames',activeNames);
let param = {
expandKeys: activeNames,
setEntry: true,
token: this.userInfo.userToken,
}
this.POST("portal/portalApp/updateExpandStatus?projectId="+this.projectId, param).then(res => {
});
},
deleteFlow() {
},
chooseItem(item) {
let _this = this;
if(item.disabled === true) {
console.log('item',item);
Toast('尚未开始，敬请期待');
}
},
// 弹框提示
toastToBuy() {
Toast('购买后可学习课程');
}
}
};
</script>
<style lang="scss">
@import "../../style/mixin";
.van-dialog {
transform: translate(-50%,-50%);
width: px2rem(300px);
border-radius: px2rem(3px);
.van-dialog__header {
padding-top: px2rem(30px);
font-size: px2rem(18px);
color: #333333;
}
.van-dialog__content {
.van-dialog__message--has-title {
padding-top: px2rem(14px);
text-align: left;
color: #676869;
font-weight:400;
}
}
.van-dialog__footer {
.van-button {
.van-button__text {
color: #449284;
font-size: px2rem(17px);
}
}
}
}
.van-toast {
// background: #000000;
div {
font-size:px2rem(12px);
color: #FFFFFF;
}
}
.van-toast--text {
padding: px2rem(7px) px2rem(8px);
}
.no-more-bottom {
position: relative;
width: 100%;
height: px2rem(40px);
}
.cell-detail {
.van-hairline--top::after , .van-hairline--top-bottom::after {
border-width: 0px;
}
.van-collapse-item {
.van-cell {
margin: px2rem(9px) auto 0 auto;
width: px2rem(345px);
min-height: px2rem(48px);
border-radius: px2rem(6px);
}
.van-collapse-item__title {
background: #F8F9FA;
.van-cell__title {
max-width: px2rem(200px);
vertical-align: middle;
line-height: px2rem(30px);
flex: auto;
span {
color: #373839;
font-weight:500;
font-size: px2rem(15px);
height: px2rem(15px);
line-height: px2rem(15px);
}
}
.van-cell__value {
// max-width: px2rem(80px);
line-height: px2rem(30px);
span {
color: #979899;
font-weight:500;
font-size: px2rem(14px);
line-height: px2rem(14px);
}
}
.van-icon {
margin-top: px2rem(3px);
color: #999999;
}
}
.van-collapse-item__title--expanded {
background: #E3EFED;
.van-cell__title {
span {
color: #449284;
font-weight:500;
font-size: px2rem(15px);
line-height: px2rem(15px);
}
}
.van-cell__value {
span {
color: #449284;
font-weight:500;
font-size: px2rem(14px);
line-height: px2rem(14px);
}
}
.van-icon {
color: #449284;
}
}
.van-collapse-item__title--disabled {
.van-cell__right-icon {
display: none;
}
.van-cell__title , .van-cell__value{
span {
color: #979899;
}
}
}
.van-collapse-item__content {
padding: 0;
}
}
.line-component {
position: relative;
margin-top: px2rem(20px);
margin-left: 0;
width: px2rem(373px);
height: px2rem(6px);
background: #F8F9FA;
}
}
.cell-container {
display: flex;
flex-direction: column;
margin: px2rem(20px) px2rem(0px) px2rem(-28px) px2rem(0px);
&-item {
position: relative;
display: flex;
flex-direction: row;
margin-bottom: px2rem(39px);
line-height: px2rem(51px);
font-size: px2rem(15px);
justify-content: space-between;
align-items: center;
.name {
.name-img {
position: relative;
z-index: 9;
margin-right: px2rem(6px);
width: px2rem(20px);
height: px2rem(20px);
float: left;
.img-icon {
position: absolute;
top: 0;
left: 0;
width: px2rem(20px);
height: px2rem(20px);
}
}
&-logo {
position: relative;
z-index: 9;
margin-right: px2rem(6px);
width: px2rem(20px);
height: px2rem(20px);
text-align: center;
background:rgba(68,146,132,1);
font-size: px2rem(12px);
font-weight: 700;
color: #FFFFFF;
border-radius: 50%;
float: left;
line-height: px2rem(22px);
// display:table;
// overflow:hidden;
// span {
// color: #FFFFFF;
// font-size: px2rem(12px);
// font-weight: 700;
// display: table-cell;
// text-align: center;
// vertical-align: middle;
// line-height: px2rem(20px);
// }
// &::before {
// position: absolute;
// top: px2rem(-6px);
// left: px2rem(8px);
// display: inline-block;
// height: px2rem(6px);
// width: px2rem(4px);
// background: #FFFFFF;
// content: "";
// }
// &::after {
// position: absolute;
// top: px2rem(20px);
// left: px2rem(8px);
// display: inline-block;
// height: px2rem(6px);
// width: px2rem(4px);
// background: #FFFFFF;
// content: "";
// }
}
&-learn {
background:rgba(246, 131, 103, 1);
}
&-logo-no {
background:rgba(231, 232, 233, 1);
}
&-title {
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
width: px2rem(231px);
font-size: px2rem(15px);
font-weight: 700;
line-height: px2rem(22px);
color: #333333;
float: left;
}
&-title-no {
color: #979899;
}
// &::before {
// position: relative;
// top: px2rem(3px);
// display: inline-block;
// width: px2rem(4px);
// content: "";
// margin-right: px2rem(5px);
// height: px2rem(16px);
// background: #449284;
// border-radius: px2rem(3px);
// }
// span {
// img {
// margin-top: px2rem(4px);
// position: relative;
// top: px2rem(2px);
// width: px2rem(70px);
// height: px2rem(20px);
// }
// }
}
.text-action {
width: px2rem(68px);
height: px2rem(25px);
line-height: px2rem(25px);
text-align: center;
font-size: px2rem(12px);
font-weight: 700;
border-radius: px2rem(15px);
border: px2rem(1px) solid rgba(68, 146, 132, 0.6);
color: rgba(68, 146, 132, 1);
img {
position: relative;
left: px2rem(2px);
top: px2rem(3px);
width: px2rem(8px);
height: px2rem(12px);
}
&-no {
border: px2rem(1px) solid #c7c8c9;
color: #c7c8c9;
}
}
.key {
width: px2rem(15px);
height: px2rem(15px);
}
}
span {
.cert-img {
margin-left: px2rem(26px);
position: relative;
top: px2rem(-34px);
width: px2rem(70px);
height: px2rem(20px);
}
.space2 {
top: px2rem(-34px);
}
}
.connect-line {
position: absolute;
// top: px2rem(32px);
top: px2rem(3px);
left: px2rem(8.5px);
height: px2rem(42px);
width: px2rem(3px);
background: #F8F9FA;
// border: 0.5px dashed rgba(240, 241, 244, 1);
}
.line-complete {
background: #E3EFED;
}
.len4 {
// height: px2rem(100px);
height: px2rem(106px);
}
.len3 {
// height: px2rem(82px);
height: px2rem(88px);
}
.len2 {
// height: px2rem(82px);
height: px2rem(88px);
}
.len1 {
// height: px2rem(62px);
height: px2rem(68px);
}
.bottom-line {
position: relative;
margin: px2rem(-19px) 0 px2rem(20px) 0;
bottom: 0px;
width: 100%;
height: px2rem(6px);
background: #F8F9FA;
border-radius: px2rem(2px);
// border-bottom: 0.5px solid #F0F1F2;
}
.foot-line {
position: absolute;
width: px2rem(311px);
margin-left: px2rem(34.5px);
height: px2rem(1px);
background: #E7E8E9;
// border-bottom: 0.5px solid #E7E8E9;
transform: scaleY(0.5);
bottom: px2rem(-20px);
}
}
.bg-13 {
background: #abcec7;
}
</style>
\ No newline at end of file
src/components/business/cell-list-detail.vue
浏览文件 @ 9f03cc32
......@@ -33,13 +33,12 @@
</div>
<span
@click="gotoExamOrCourse(item)"
v-show="hasBindCard"
class="text-action"
:class="{'text-action-no': item.useFlag == 2}"
>
{{getActionText(item.status)}}
</span>
<img @click="toastToBuy" class="key" v-show="!hasBindCard" src="../../images/cme/phrase2/key.png" alt="">
<!-- <img @click="toastToBuy" class="key" v-show="!hasBindCard" src="../../images/cme/phrase2/key.png" alt=""> -->
<div class="foot-line"
v-if="index+1 < portalModule.contentList.length && portalModule.contentList[index].templetId == portalModule.contentList[index+1].templetId">
</div>
......@@ -117,6 +116,10 @@ export default {
courseRequire: {
type: Number | String,
default: 0,
},
limitTimes: {
type: Number | String,
default: 0,
}
},
computed: {
......@@ -154,11 +157,11 @@ export default {
}
let appVersion = getAppVersion(this.userInfo.appVersion);
if (item.useFlag == 2) return;
if (window.__isWeb) {
// this.$refs.toastTitle.toast("请您下载App");
Toast('请您下载App');
return;
}
// if (window.__isWeb) {
// // this.$refs.toastTitle.toast("请您下载App");
// Toast('请您下载App');
// return;
// }
if (item.type == 1) {
if (appVersion <= 300) {
// this.$refs.toastTitle.toast("请您下载新版本App");
......@@ -174,6 +177,19 @@ export default {
// 跳转到课程
gotoCourse: function(courseId) {
let appVersion = getAppVersion(this.userInfo.appVersion);
// 弹框提示下载新版本可以试看
if(appVersion < 343) {
this.$dialog.confirm({
className: 'con-dialog',
showCancelButton: false,
message: '升级最新版本可试看课程',
confirmButtonText: '我知道了',
}).then(res => {
})
return;
}
let paramList = []
paramList = [
{
......@@ -200,6 +216,18 @@ export default {
type: 4,
seqNo: 1
},
{
key: "limitTimes",
value: this.limitTimes - 0,
type: 4,
seqNo: 1
},
{
key: "hasBindCard",
value: this.hasBindCard ? 1 : 0,
type: 4,
seqNo: 1
},
];
rocNative.dispatchEventByModuleCode({
modeCode: "M200",
......
src/views/merge-detail.vue
浏览文件 @ 9f03cc32
......@@ -91,6 +91,7 @@
:detailNum="detailNum"
:courseRequire="courseRequire"
:hasBindCard="hasBindCard"
:limitTimes="limitTimes"
/>
</div>
</div>
......@@ -239,6 +240,7 @@ export default {
// currentProgress>1时考试按钮显示并可用
},
hasBindCard: false, // 是否绑定过学习卡或激活过 没有绑定，则显示绑定按钮
limitTimes: 60,
projectLeader: {},
doctorList: [],
from: "inner",
......@@ -937,6 +939,7 @@ export default {
// 如果 hasBindCard 为false，则获取卡信息 0：未绑卡 1：已绑卡
_this.hasBindCard = res.data.cardStatus == 0 ? false : true;
_this.limitTimes = res.data.trySeeTime || 60;
if (!_this.hasBindCard) {
_this.preJumper();
}
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或