提交 eaa6cfc4 编写于 作者: guangjun.yang's avatar guangjun.yang

Merge branch 'release' of...

Merge branch 'release' of http://192.168.110.53/com.pica.cloud.education.frontend/pica-cooperation-cme into release
{ {
"presets": ["env", "es2015", "stage-2"], "presets": [
"@babel/preset-env"
],
"plugins": [ "plugins": [
"add-module-exports", "add-module-exports",
"transform-runtime", [
"@babel/plugin-transform-runtime",
{
"corejs": 2
}
],
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-syntax-import-meta",
"@babel/plugin-proposal-class-properties",
"@babel/plugin-proposal-json-strings",
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
],
"@babel/plugin-proposal-function-sent",
"@babel/plugin-proposal-export-namespace-from",
"@babel/plugin-proposal-numeric-separator",
"@babel/plugin-proposal-throw-expressions"
], ],
"comments": false, "comments": false
} }
...@@ -4,8 +4,8 @@ var utils = require('./utils') ...@@ -4,8 +4,8 @@ var utils = require('./utils')
var projectRoot = path.resolve(__dirname, '../') var projectRoot = path.resolve(__dirname, '../')
var env = process.env.NODE_ENV var env = process.env.NODE_ENV
// check env & config/index.js to decide weither to enable CSS Sourcemaps for the // check env & config/index.js to decide weither to enable CSS Sourcemaps for the
// various preprocessor loaders added to vue-loader at the end of this file // various preprocessor loaders added to vue-loader at the end of this file
var cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap) var cssSourceMapDev = (env === 'development' && config.dev.cssSourceMap)
var cssSourceMapProd = (env === 'production' && config.build.productionSourceMap) var cssSourceMapProd = (env === 'production' && config.build.productionSourceMap)
var useCssSourceMap = cssSourceMapDev || cssSourceMapProd var useCssSourceMap = cssSourceMapDev || cssSourceMapProd
...@@ -69,6 +69,15 @@ module.exports = { ...@@ -69,6 +69,15 @@ module.exports = {
postcss: [ postcss: [
require('autoprefixer')({ require('autoprefixer')({
browsers: ['last 10 versions'] browsers: ['last 10 versions']
}),
require('postcss-pxtorem')({
rootValue: 37.5,
unitPrecision: 5,
propWhiteList: [],
selectorBlackList: [/^html$/],
replace: true,
mediaQuery: false,
minPixelValue: 2
}) })
] ]
} }
......
...@@ -23,7 +23,7 @@ module.exports = { ...@@ -23,7 +23,7 @@ module.exports = {
NODE_ENV: '"development"', NODE_ENV: '"development"',
BUILD_ENV: '"' + process.env.BUILD_ENV + '"' BUILD_ENV: '"' + process.env.BUILD_ENV + '"'
}, },
port: 8009, port: 8020,
assetsSubDirectory: 'static', assetsSubDirectory: 'static',
assetsPublicPath: '/', assetsPublicPath: '/',
// proxyTable: { // proxyTable: {
...@@ -35,7 +35,7 @@ module.exports = { ...@@ -35,7 +35,7 @@ module.exports = {
context: [ //代理路径 context: [ //代理路径
'/test' '/test'
], ],
proxypath: 'http://localhost:9000', proxypath: 'http://localhost:9009',
cssSourceMap: true cssSourceMap: true
} }
} }
\ No newline at end of file
此差异已折叠。
...@@ -15,37 +15,41 @@ ...@@ -15,37 +15,41 @@
"build:pro": "cross-env BUILD_ENV=pro node build/build.js" "build:pro": "cross-env BUILD_ENV=pro node build/build.js"
}, },
"dependencies": { "dependencies": {
"@babel/polyfill": "^7.2.5", "@babel/polyfill": "^7.10.4",
"axios": "0.16.2", "axios": "0.16.2",
"better-scroll": "^0.1.15", "clipboard": "^2.0.6",
"echarts": "^4.2.0-rc.2", "pdfjs-dist": "^2.4.456",
"fastclick": "^1.0.6",
"img-vuer": "^0.17.2",
"iscroll": "^5.2.0",
"js-cookie": "^2.2.0",
"pica-topic-stencil": "^1.0.8", "pica-topic-stencil": "^1.0.8",
"showdown": "^1.6.4",
"vant": "^2.2.15", "vant": "^2.2.15",
"vconsole": "^3.3.4", "vconsole": "^3.3.4",
"vue": "^2.1.0", "vue": "^2.1.0",
"vue-router": "^2.1.1", "vue-router": "^2.1.1",
"vuex": "^2.0.0", "vuex": "^2.0.0",
"web-buried-point": "^2.1.0" "web-buried-point": "^2.1.0",
"weixin-js-sdk": "^1.4.0-test"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-sent": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
"@babel/plugin-proposal-throw-expressions": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/plugin-transform-runtime": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/register": "^7.0.0",
"@babel/runtime-corejs2": "^7.0.0",
"autoprefixer": "^6.4.0", "autoprefixer": "^6.4.0",
"autoprefixer-loader": "^3.2.0", "autoprefixer-loader": "^3.2.0",
"babel-core": "^6.0.0", "babel-core": "^7.0.0-bridge.0",
"babel-loader": "^6.0.0", "babel-loader": "7.1.1",
"babel-plugin-add-module-exports": "^1.0.0", "babel-plugin-add-module-exports": "^1.0.0",
"babel-plugin-component": "^1.1.1", "babel-plugin-component": "^1.1.1",
"babel-plugin-import": "^1.11.0", "babel-plugin-import": "^1.11.0",
"babel-plugin-transform-runtime": "^6.0.0",
"babel-preset-env": "^1.7.0",
"babel-preset-es2015": "^6.0.0",
"babel-preset-stage-2": "^6.0.0",
"babel-register": "^6.0.0",
"babel-runtime": "^6.23.0",
"chalk": "^1.1.3", "chalk": "^1.1.3",
"connect-history-api-fallback": "^1.1.0", "connect-history-api-fallback": "^1.1.0",
"cross-env": "^5.0.0", "cross-env": "^5.0.0",
...@@ -61,13 +65,9 @@ ...@@ -61,13 +65,9 @@
"less": "^2.7.1", "less": "^2.7.1",
"less-loader": "^2.2.3", "less-loader": "^2.2.3",
"node-gyp": "^3.4.0", "node-gyp": "^3.4.0",
"node-sass": "^4.9.2",
"opn": "^4.0.2", "opn": "^4.0.2",
"ora": "^0.3.0", "ora": "^0.3.0",
"sass": "^0.5.0", "postcss-pxtorem": "^5.1.1",
"sass-loader": "^4.1.1",
"scss": "^0.2.4",
"scss-loader": "0.0.1",
"semver": "^5.3.0", "semver": "^5.3.0",
"shelljs": "^0.7.4", "shelljs": "^0.7.4",
"style-loader": "^0.13.1", "style-loader": "^0.13.1",
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
</script> </script>
<style lang="scss"> <style lang="less">
@import './style/mixin'; @import './style/mixin';
@import './style/common'; @import './style/common';
@import './style/global'; @import './style/global';
......
...@@ -44,15 +44,14 @@ export default { ...@@ -44,15 +44,14 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.back-btn { .back-btn {
position: fixed; position: fixed;
width: px2rem(35px); width: 35px;
height: px2rem(35px); height: 35px;
right: px2rem(15px); right: 15px;
z-index: 100; z-index: 100;
bottom: px2rem(80px); bottom: 80px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
......
此差异已折叠。
...@@ -51,7 +51,7 @@ const actionMap = { ...@@ -51,7 +51,7 @@ const actionMap = {
12: "再考一次", 12: "再考一次",
13: "已通过", 13: "已通过",
14: "已完成", 14: "已完成",
15: "去刷分", 15: "已通过",
16: "未通过", 16: "未通过",
21: "去学习", 21: "去学习",
22: "继续学习", 22: "继续学习",
...@@ -77,6 +77,10 @@ export default { ...@@ -77,6 +77,10 @@ export default {
courseRequire: { courseRequire: {
type: Number, type: Number,
default: 0, default: 0,
},
projectId: {
type: Number | String,
default: 0,
} }
}, },
computed: { computed: {
...@@ -143,7 +147,14 @@ export default { ...@@ -143,7 +147,14 @@ export default {
type: 4, type: 4,
seqNo: 1 seqNo: 1
}, },
{
key: "projectId",
value: this.projectId,
type: 4,
seqNo: 1
},
]; ];
console.log('gotoCourse', paramList);
rocNative.dispatchEventByModuleCode({ rocNative.dispatchEventByModuleCode({
modeCode: "M200", modeCode: "M200",
jsonString: paramList jsonString: paramList
...@@ -179,70 +190,69 @@ export default { ...@@ -179,70 +190,69 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.cell-container { .cell-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin: 0 px2rem(15px); margin: 0 15px;
&-item { &-item {
position: relative; position: relative;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
// margin: px2rem(6px) px2rem(0px); // margin: 6px 0px;
// height: px2rem(51px); // height: 51px;
margin-bottom: px2rem(32px); margin-bottom: 32px;
line-height: px2rem(51px); line-height: 51px;
font-size: px2rem(15px); font-size: 15px;
// padding: px2rem(0px) px2rem(15px); // padding: 0px 15px;
// background: rgba(248, 249, 250, 1); // background: rgba(248, 249, 250, 1);
// border-bottom: 1px solid #f0f0f0; // border-bottom: 1px solid #f0f0f0;
// border-radius: px2rem(6px); // border-radius: 6px;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.name { .name {
&-logo { &-logo {
position: relative; position: relative;
z-index: 9; z-index: 9;
margin-right: px2rem(6px); margin-right: 6px;
width: px2rem(20px); width: 20px;
height: px2rem(20px); height: 20px;
text-align: center; text-align: center;
background:rgba(68,146,132,1); background:rgba(68,146,132,1);
font-size: px2rem(12px); font-size: 12px;
font-weight: 700; font-weight: 700;
color: #FFFFFF; color: #FFFFFF;
border-radius: 50%; border-radius: 50%;
float: left; float: left;
line-height: px2rem(22px); line-height: 22px;
// display:table; // display:table;
// overflow:hidden; // overflow:hidden;
// span { // span {
// color: #FFFFFF; // color: #FFFFFF;
// font-size: px2rem(12px); // font-size: 12px;
// font-weight: 700; // font-weight: 700;
// display: table-cell; // display: table-cell;
// text-align: center; // text-align: center;
// vertical-align: middle; // vertical-align: middle;
// line-height: px2rem(20px); // line-height: 20px;
// } // }
&::before { &::before {
position: absolute; position: absolute;
top: px2rem(-6px); top: -6px;
left: px2rem(8px); left: 8px;
display: inline-block; display: inline-block;
height: px2rem(6px); height: 6px;
width: px2rem(4px); width: 4px;
background: #FFFFFF; background: #FFFFFF;
content: ""; content: "";
} }
&::after { &::after {
position: absolute; position: absolute;
top: px2rem(20px); top: 20px;
left: px2rem(8px); left: 8px;
display: inline-block; display: inline-block;
height: px2rem(6px); height: 6px;
width: px2rem(4px); width: 4px;
background: #FFFFFF; background: #FFFFFF;
content: ""; content: "";
} }
...@@ -254,57 +264,59 @@ export default { ...@@ -254,57 +264,59 @@ export default {
background:rgba(231, 232, 233, 1); background:rgba(231, 232, 233, 1);
} }
&-title { &-title {
flex: 1;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
width: px2rem(231px); // width: 231px;
font-size: px2rem(15px); font-size: 15px;
font-weight: 700; font-weight: 700;
line-height: px2rem(21px); line-height: 21px;
color: #373839; color: #373839;
float: left; padding-right: 10px;
// float: left;
} }
&-title-no { &-title-no {
color: rgba(151, 152, 153, 1); color: rgba(151, 152, 153, 1);
} }
// &::before { // &::before {
// position: relative; // position: relative;
// top: px2rem(3px); // top: 3px;
// display: inline-block; // display: inline-block;
// width: px2rem(4px); // width: 4px;
// content: ""; // content: "";
// margin-right: px2rem(5px); // margin-right: 5px;
// height: px2rem(16px); // height: 16px;
// background: #449284; // background: #449284;
// border-radius: px2rem(3px); // border-radius: 3px;
// } // }
// span { // span {
// img { // img {
// margin-top: px2rem(4px); // margin-top: 4px;
// position: relative; // position: relative;
// top: px2rem(2px); // top: 2px;
// width: px2rem(70px); // width: 70px;
// height: px2rem(20px); // height: 20px;
// } // }
// } // }
} }
.text-action { .text-action {
width: px2rem(68px); width: 68px;
height: px2rem(25px); height: 25px;
line-height: px2rem(25px); line-height: 25px;
text-align: center; text-align: center;
font-size: px2rem(12px); font-size: 12px;
font-weight: 700; font-weight: 700;
border-radius: px2rem(15px); border-radius: 15px;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
// opacity: 0.45; // opacity: 0.45;
border: 0.5px solid rgba(68, 146, 132, 0.6); border: 0.5px solid rgba(68, 146, 132, 0.6);
color: rgba(68, 146, 132, 1); color: rgba(68, 146, 132, 1);
img { img {
position: relative; position: relative;
left: px2rem(2px); left: 2px;
top: px2rem(3px); top: 3px;
width: px2rem(8px); width: 8px;
height: px2rem(12px); height: 12px;
} }
&-no { &-no {
border: 0.5px solid #c7c8c9; border: 0.5px solid #c7c8c9;
...@@ -317,40 +329,40 @@ export default { ...@@ -317,40 +329,40 @@ export default {
} }
span { span {
img { img {
margin-left: px2rem(26px); margin-left: 26px;
position: relative; position: relative;
top: px2rem(-28px); top: -28px;
width: px2rem(70px); width: 70px;
height: px2rem(20px); height: 20px;
} }
.space2 { .space2 {
top: px2rem(-26px); top: -26px;
} }
} }
.connect-line { .connect-line {
position: absolute; position: absolute;
// top: px2rem(32px); // top: 32px;
top: px2rem(3px); top: 3px;
left: px2rem(9.5px); left: 9.5px;
height: px2rem(42px); height: 42px;
width: 0.5px; width: 0.5px;
border: 0.5px dashed rgba(240, 241, 244, 1); border: 0.5px dashed rgba(240, 241, 244, 1);
} }
.len4 { .len4 {
height: px2rem(100px); height: 100px;
} }
.len3 { .len3 {
height: px2rem(82px); height: 82px;
} }
.len2 { .len2 {
height: px2rem(82px); height: 82px;
} }
.len1 { .len1 {
height: px2rem(62px); height: 62px;
} }
.bottom-line { .bottom-line {
position: relative; position: relative;
margin: px2rem(6px) 0 px2rem(28px) 0; margin: 6px 0 28px 0;
bottom: 0px; bottom: 0px;
width: 100%; width: 100%;
border-bottom: 0.5px solid #F0F1F2; border-bottom: 0.5px solid #F0F1F2;
......
...@@ -33,14 +33,14 @@ export default { ...@@ -33,14 +33,14 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.cert-show-container { .cert-show-container {
display: flex; display: flex;
margin: px2rem(10px) px2rem(15px) 0 px2rem(15px); margin: 10px 15px 0 15px;
img { img {
width: px2rem(345px); // width: 345px;
height: px2rem(70px); width: 100%;
height: 70px;
} }
} }
</style> </style>
......
...@@ -75,7 +75,7 @@ export default { ...@@ -75,7 +75,7 @@ export default {
}); });
return; return;
} }
let pageUrl = getWebPageUrl('coopv2/#/comp2'); let pageUrl = getWebPageUrl('cme/#/comp2');
let moduleName = encodeURIComponent(item.moduleName) let moduleName = encodeURIComponent(item.moduleName)
let paramList = [ let paramList = [
{ {
...@@ -94,51 +94,50 @@ export default { ...@@ -94,51 +94,50 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.comp-container { .comp-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin: 0 px2rem(15px); margin: 0 15px;
&-item { &-item {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin: px2rem(6px) px2rem(0px); margin: 6px 0px;
height: px2rem(51px); height: 51px;
// line-height: px2rem(51px); // line-height: 51px;
font-size: px2rem(15px); font-size: 15px;
padding: px2rem(0px) px2rem(15px); padding: 0px 15px;
background: rgba(248, 249, 250, 1); background: rgba(248, 249, 250, 1);
border-radius: px2rem(6px); border-radius: 6px;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.name { .name {
max-width: px2rem(240px); max-width: 240px;
font-size: px2rem(15px); font-size: 15px;
line-height: px2rem(25px) !important; line-height: 25px !important;
color: #676869; color: #676869;
} }
.action { .action {
width: px2rem(60px); width: 60px;
height: px2rem(25px); height: 25px;
line-height: px2rem(25px); line-height: 25px;
text-align: center; text-align: center;
font-size: px2rem(12px); font-size: 12px;
font-weight: 700; font-weight: 700;
border-radius: px2rem(15px); border-radius: 15px;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
// opacity: 0.45; // opacity: 0.45;
border: 1px solid rgba(68, 146, 132, 0.6); border: 1px solid rgba(68, 146, 132, 0.6);
color: rgba(68, 146, 132, 1); color: rgba(68, 146, 132, 1);
} }
.action-no { .action-no {
width: px2rem(60px); width: 60px;
height: px2rem(25px); height: 25px;
line-height: px2rem(25px); line-height: 25px;
text-align: center; text-align: center;
font-size: px2rem(12px); font-size: 12px;
font-weight: 700; font-weight: 700;
border-radius: px2rem(15px); border-radius: 15px;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
// opacity: 0.45; // opacity: 0.45;
border: 1px solid #E7E8E9; border: 1px solid #E7E8E9;
...@@ -150,7 +149,7 @@ export default { ...@@ -150,7 +149,7 @@ export default {
} }
} }
.ht-for-m16 { .ht-for-m16 {
height: px2rem(66px); height: 66px;
} }
</style> </style>
...@@ -174,26 +174,25 @@ export default { ...@@ -174,26 +174,25 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.mater-container { .mater-container {
position: relative; position: relative;
margin: px2rem(0px) px2rem(15px); margin: 0px 15px;
} }
.mater-item { .mater-item {
display: flex; display: flex;
// width: 100%; // width: 100%;
height: px2rem(80px); height: 80px;
border-bottom: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;
background: #fff; background: #fff;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
img { img {
width: px2rem(35px); width: 35px;
height: px2rem(37px); height: 37px;
margin-right: px2rem(10px); margin-right: 10px;
border-radius: px2rem(3px) px2rem(2px) px2rem(2px) px2rem(3px); border-radius: 3px 2px 2px 3px;
} }
&-left { &-left {
display: flex; display: flex;
...@@ -202,40 +201,40 @@ export default { ...@@ -202,40 +201,40 @@ export default {
} }
&-right { &-right {
display: flex; display: flex;
// width: px2rem(215px); // width: 215px;
flex: 1; flex: 1;
flex-direction: column; flex-direction: column;
padding-top: px2rem(4px); padding-top: 4px;
&-title { &-title {
// height: px2rem(50px); // height: 50px;
line-height: px2rem(23px); line-height: 23px;
font-size: px2rem(15px); font-size: 15px;
font-weight: 700; font-weight: 700;
color: rgba(55, 56, 57, 1); color: rgba(55, 56, 57, 1);
} }
&-other { &-other {
height: px2rem(22px); height: 22px;
line-height: px2rem(20px); line-height: 20px;
font-size: px2rem(13px); font-size: 13px;
font-weight: 400; font-weight: 400;
color: rgba(151, 152, 153, 1); color: rgba(151, 152, 153, 1);
} }
} }
.mater-details { .mater-details {
position: relative; position: relative;
right: px2rem(-10px); right: -10px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
span { span {
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
font-size: px2rem(14px); font-size: 14px;
font-weight: 700; font-weight: 700;
color: #666; color: #666;
} }
img { img {
width: px2rem(15px); width: 15px;
height: px2rem(16px); height: 16px;
} }
} }
} }
......
...@@ -97,52 +97,52 @@ export default { ...@@ -97,52 +97,52 @@ export default {
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.comp-title-container { .comp-title-container {
margin-top: px2rem(17px); margin-top: 17px;
padding-left: px2rem(15px); padding-left: 15px;
// display: flex; // display: flex;
// flex-direction: row; // flex-direction: row;
// justify-content: space-between; // justify-content: space-between;
.comp-text { .comp-text {
position: relative; position: relative;
width: px2rem(345px); // width: 345px;
width: 100%;
overflow: hidden; overflow: hidden;
} }
} }
.comp-title { .comp-title {
position: relative; position: relative;
width: px2rem(238px); width: 238px;
float: left; float: left;
line-height: px2rem(30px); line-height: 30px;
} }
.comp-title-explain { .comp-title-explain {
position: relative; position: relative;
float: right; float: right;
// margin-right: px2rem(15px); // margin-right: 15px;
margin-top: px2rem(3px); margin-top: 3px;
span { span {
font-size: px2rem(14px); font-size: 14px;
font-weight: 400; font-weight: 400;
color: rgba(12, 21, 39, 0.4); color: rgba(12, 21, 39, 0.4);
// margin-right: px2rem(3px); // margin-right: 3px;
line-height: px2rem(18px); line-height: 18px;
height: px2rem(18px); height: 18px;
vertical-align: middle; vertical-align: middle;
} }
img { img {
width: px2rem(8px); width: 8px;
height: px2rem(12px); height: 12px;
vertical-align: middle; vertical-align: middle;
} }
} }
.cert-img { .cert-img {
margin-top: px2rem(1px); margin-top: 1px;
.banner-img { .banner-img {
width: px2rem(70px); width: 70px;
height: px2rem(20px); height: 20px;
padding-top: px2rem(2px); padding-top: 2px;
} }
} }
</style> </style>
\ No newline at end of file
...@@ -5,8 +5,8 @@ ...@@ -5,8 +5,8 @@
class="nc-container-img" class="nc-container-img"
src="../../images/cme/no-content.png" src="../../images/cme/no-content.png"
> >
<span v-if="tabNum == 1" class="nc-container-text">您还未参加CME项目哦~</span> <span v-if="tabNum == 1" class="nc-container-text">您还未参加继教项目哦~</span>
<span v-if="tabNum == 2" class="nc-container-text">当前无可学CME项目哦~</span> <span v-if="tabNum == 2" class="nc-container-text">当前无可学继教项目哦~</span>
</section> </section>
</template> </template>
...@@ -24,27 +24,26 @@ export default { ...@@ -24,27 +24,26 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.nc-container { .nc-container {
display: flex; display: flex;
width: 100%; width: 100%;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-content: center; align-content: center;
margin-top: px2rem(150px); margin-top: 100px;
margin-bottom: px2rem(20px); margin-bottom: 20px;
text-align: center; text-align: center;
// margin: 0 auto; // margin: 0 auto;
&-img { &-img {
margin-left: px2rem(100px); margin-left: 100px;
width: px2rem(150px); width: 150px;
height: px2rem(150px); height: 150px;
} }
&-text { &-text {
height: px2rem(21px); height: 21px;
line-height: px2rem(21px); line-height: 21px;
font-size: px2rem(15px); font-size: 15px;
font-weight: 400; font-weight: 400;
color: rgba(153, 153, 153, 1); color: rgba(153, 153, 153, 1);
} }
......
...@@ -17,13 +17,12 @@ ...@@ -17,13 +17,12 @@
} }
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.nc-container { .nc-container {
display: flex; display: flex;
&-content { &-content {
width: 100%; width: 100%;
height: px2rem(62px); height: 62px;
} }
} }
</style> </style>
......
...@@ -19,35 +19,34 @@ export default { ...@@ -19,35 +19,34 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.nc-container { .nc-container {
display: flex; display: flex;
width: 100%; width: 100%;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-content: center; align-content: center;
margin-top: px2rem(70px); margin-top: 70px;
text-align: center; text-align: center;
// margin: 0 auto; // margin: 0 auto;
&-img { &-img {
width: px2rem(60px); width: 60px;
height: px2rem(72px); height: 72px;
margin-left: px2rem(157px); margin-left: 157px;
margin-bottom: px2rem(15px); margin-bottom: 15px;
} }
&-text1 { &-text1 {
height: px2rem(15px); height: 15px;
line-height: px2rem(15px); line-height: 15px;
font-size: px2rem(15px); font-size: 15px;
font-weight: 500; font-weight: 500;
color:rgba(103, 104, 105, 1); color:rgba(103, 104, 105, 1);
} }
&-text2 { &-text2 {
height: px2rem(16px); height: 16px;
line-height: px2rem(16px); line-height: 16px;
margin-top: px2rem(6px); margin-top: 6px;
font-size: px2rem(13px); font-size: 13px;
font-weight: 400; font-weight: 400;
color: rgba(151, 152, 153, 1); color: rgba(151, 152, 153, 1);
} }
......
...@@ -48,49 +48,48 @@ export default { ...@@ -48,49 +48,48 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.item-notice-wrapper { .item-notice-wrapper {
.content { .content {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
height: px2rem(32px); height: 32px;
line-height: px2rem(32px); line-height: 32px;
padding: 0 px2rem(15px); padding: 0 15px;
text-align: left; text-align: left;
align-items: center; align-items: center;
background: #FEFAF5; background: #FEFAF5;
img { img {
width: px2rem(12px); width: 12px;
height: px2rem(12px); height: 12px;
line-height: px2rem(32px); line-height: 32px;
} }
span { span {
font-size: px2rem(13px); font-size: 13px;
text-align: left; text-align: left;
&.gg { &.gg {
// width: px2rem(30px); // width: 30px;
padding: px2rem(1px) px2rem(5px) 0; padding: 1px 5px 0;
font-size: px2rem(13px); font-size: 13px;
font-weight: 700; font-weight: 700;
color: #835800; color: #835800;
} }
&.vtc-line { &.vtc-line {
margin-top: px2rem(0px); margin-top: 0px;
width: px2rem(1px); width: 1px;
height: px2rem(15px); height: 15px;
background: #835800; background: #835800;
} }
&.content { &.content {
display: block; display: block;
flex: 1; flex: 1;
padding-top: px2rem(1px); padding-top: 1px;
// padding-left: px2rem(5px) !important; // padding-left: 5px !important;
padding: 0 px2rem(10px) 0 px2rem(5px); padding: 0 10px 0 5px;
height: px2rem(32px); height: 32px;
line-height: px2rem(32px); line-height: 32px;
text-align: left; text-align: left;
font-size: px2rem(13px); font-size: 13px;
font-weight: 700; font-weight: 700;
color: #E6A23C; color: #E6A23C;
white-space: nowrap; white-space: nowrap;
......
...@@ -150,8 +150,7 @@ export default { ...@@ -150,8 +150,7 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.pop-sign-box { .pop-sign-box {
position: fixed; position: fixed;
width: 100%; width: 100%;
...@@ -162,67 +161,67 @@ export default { ...@@ -162,67 +161,67 @@ export default {
.pop-box { .pop-box {
background: #fff; background: #fff;
// background: #00FF00 url(../../images/tankuang.png) no-repeat center center ; // background: #00FF00 url(../../images/tankuang.png) no-repeat center center ;
width: px2rem(280px); width: 280px;
height: px2rem(312px); height: 312px;
border-radius: px2rem(7px); border-radius: 7px;
position: absolute; position: absolute;
z-index: 112; z-index: 112;
text-align: center; text-align: center;
left: 50%; left: 50%;
top: 50%; top: 50%;
margin: px2rem(-180px) 0 0 px2rem(-140px); margin: -180px 0 0 -140px;
img { img {
width: px2rem(280px); width: 280px;
height: px2rem(312px); height: 312px;
vertical-align: middle; vertical-align: middle;
} }
&-btn { &-btn {
position: relative; position: relative;
top: px2rem(-62px); top: -62px;
display: inline-block; display: inline-block;
width: px2rem(215px); width: 215px;
height: px2rem(44px); height: 44px;
line-height: px2rem(44px); line-height: 44px;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
font-size: px2rem(16px); font-size: 16px;
background: linear-gradient( background: linear-gradient(
360deg, 360deg,
rgba(255, 227, 97, 1) 0%, rgba(255, 227, 97, 1) 0%,
rgba(255, 217, 121, 1) 100% rgba(255, 217, 121, 1) 100%
); );
box-shadow: 0px px2rem(4px) px2rem(4px) 0px rgba(0, 0, 0, 0.09); box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.09);
border-radius: px2rem(22px); border-radius: 22px;
color: #a78400; color: #a78400;
font-weight: 700; font-weight: 700;
} }
} }
.pop-text { .pop-text {
position: absolute; position: absolute;
top: px2rem(160px); top: 160px;
width: 100%; width: 100%;
text-align: center; text-align: center;
&-joy { &-joy {
color: #ff9a4b; color: #ff9a4b;
font-size: px2rem(24px); font-size: 24px;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
font-weight: 700; font-weight: 700;
} }
&-tips { &-tips {
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei"; // font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
color: #ff9a4b; color: #ff9a4b;
font-size: px2rem(14px); font-size: 14px;
font-weight: 400; font-weight: 400;
padding: px2rem(8px) px2rem(10px) px2rem(24px) px2rem(10px); padding: 8px 10px 24px 10px;
} }
} }
// .si-joy { // .si-joy {
// color: #ff7c26; // color: #ff7c26;
// font-size: px2rem(18px); // font-size: 18px;
// } // }
// .si-tips { // .si-tips {
// color: #666; // color: #666;
// font-size: px2rem(14px); // font-size: 14px;
// padding: px2rem(8px) px2rem(10px) px2rem(24px) px2rem(10px); // padding: 8px 10px 24px 10px;
// } // }
.pop-mask { .pop-mask {
position: absolute; position: absolute;
...@@ -233,18 +232,18 @@ export default { ...@@ -233,18 +232,18 @@ export default {
} }
.sin-close { .sin-close {
position: absolute; position: absolute;
width: px2rem(30px); width: 30px;
height: px2rem(30px); height: 30px;
bottom: px2rem(-50px); bottom: -50px;
margin-left: px2rem(-15px); margin-left: -15px;
left: 50%; left: 50%;
img { img {
width: px2rem(30px); width: 30px;
height: px2rem(30px); height: 30px;
display: block; display: block;
} }
} }
// font-size:px2rem(12px) ; // font-size:12px ;
} }
</style> </style>
...@@ -60,8 +60,7 @@ export default { ...@@ -60,8 +60,7 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.pop-notice-wrapper { .pop-notice-wrapper {
position: fixed; position: fixed;
width: 100%; width: 100%;
...@@ -69,7 +68,7 @@ export default { ...@@ -69,7 +68,7 @@ export default {
left: 0; left: 0;
top: 0; top: 0;
z-index: 110; z-index: 110;
font-size: px2rem(20px); font-size: 20px;
.mask { .mask {
position: absolute; position: absolute;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
...@@ -82,19 +81,19 @@ export default { ...@@ -82,19 +81,19 @@ export default {
left: 50%; left: 50%;
top: 50%; top: 50%;
z-index: 112; z-index: 112;
width: px2rem(300px); width: 300px;
// height: px2rem(185px); // height: 185px;
margin: px2rem(-150px) 0 0 px2rem(-150px); margin: -150px 0 0 -150px;
border-radius: px2rem(3px); border-radius: 3px;
text-align: center; text-align: center;
background: #fff; background: #fff;
.top { .top {
padding: px2rem(30px); padding: 30px;
.title { .title {
display: inline-block; display: inline-block;
font-size: px2rem(18px); font-size: 18px;
line-height: px2rem(28px); line-height: 28px;
word-break: break-all; word-break: break-all;
font-weight: 400; font-weight: 400;
color: #333333; color: #333333;
...@@ -103,10 +102,10 @@ export default { ...@@ -103,10 +102,10 @@ export default {
text-align: left; text-align: left;
word-break: break-all; word-break: break-all;
display: inline-block; display: inline-block;
margin: px2rem(14px) 0; margin: 14px 0;
font-size: px2rem(14px); font-size: 14px;
height: px2rem(21px); height: 21px;
line-height: px2rem(21px); line-height: 21px;
font-weight: 400; font-weight: 400;
color: #676869; color: #676869;
.b { .b {
...@@ -115,18 +114,18 @@ export default { ...@@ -115,18 +114,18 @@ export default {
} }
} }
.line { .line {
width: px2rem(300px); width: 300px;
height: px2rem(1px); height: 1px;
background: rgba(240, 241, 242, 1); background: rgba(240, 241, 242, 1);
} }
.bottom { .bottom {
text-align: center; text-align: center;
font-size: px2rem(17px); font-size: 17px;
height: px2rem(50px); height: 50px;
line-height: px2rem(50px); line-height: 50px;
font-weight: 400; font-weight: 400;
span { span {
font-size: px2rem(17px); font-size: 17px;
color: #449284; color: #449284;
} }
} }
......
...@@ -31,8 +31,7 @@ export default { ...@@ -31,8 +31,7 @@ export default {
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.dialog-mask-container{ .dialog-mask-container{
position: fixed; position: fixed;
top: 0; top: 0;
...@@ -54,24 +53,24 @@ export default { ...@@ -54,24 +53,24 @@ export default {
top: 50%; top: 50%;
left: 50%; left: 50%;
overflow: hidden; overflow: hidden;
width: px2rem(300px); width: 300px;
font-size: px2rem(18px); font-size: 18px;
-webkit-transition: .3s; -webkit-transition: .3s;
transition: .3s; transition: .3s;
border-radius: px2rem(4px); border-radius: 4px;
background-color: #fff; background-color: #fff;
-webkit-transform: translate3d(-50%,-50%,0); -webkit-transform: translate3d(-50%,-50%,0);
transform: translate3d(-50%,-50%,0); transform: translate3d(-50%,-50%,0);
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
backface-visibility: hidden; backface-visibility: hidden;
.dialog-content{ .dialog-content{
padding: px2rem(30px) px2rem(22px); padding: 30px 22px;
text-align: center; text-align: center;
font-size: px2rem(18px); font-size: 18px;
color: #373839; color: #373839;
} }
.dialog-footer{ .dialog-footer{
height: px2rem(50px); height: 50px;
display: flex; display: flex;
align-items: center; align-items: center;
&.v-hairline-top::after{ &.v-hairline-top::after{
...@@ -80,9 +79,9 @@ export default { ...@@ -80,9 +79,9 @@ export default {
span{ span{
display: inline-block; display: inline-block;
width: 50%; width: 50%;
height: px2rem(50px); height: 50px;
line-height: px2rem(50px); line-height: 50px;
font-size: px2rem(17px); font-size: 17px;
text-align: center; text-align: center;
color: #979899; color: #979899;
&.v-hairline-left::after{ &.v-hairline-left::after{
......
<template>
<section @click="jumpToCardList" class="I-card-item-wrapper">
<article class="item">
<img class="left-icon" src="../../images/cme/phrase2/I-img.png" alt />
<article class="center">
<span class="top">国家级继续医学教育项目(远程)</span>
<span class="bottom">上百个项目持续更新上线</span>
</article>
<img class="right-icon" src="../../images/cme/phrase2/arr-right.png" alt />
</article>
</section>
</template>
<script>
import { Toast } from 'vant';
import { getWebPageUrl } from "@/utils/index";
import { mapGetters } from "vuex";
export default {
data() {
return {};
},
props: {
oneLevelUrl: {
type: String,
default: ""
},
provinceId: {
type: String | Number,
default: ""
},
organizationId: {
type: String | Number,
default: ""
},
cmeToken: {
type: String,
default: ""
}
},
computed: {
...mapGetters(["userInfo"])
},
methods: {
// 跳转I类学习详情(介绍)页面
jumpToCardList() {
this.$sendBuriedData({
component_tag: "880#8802"
});
let appVersion = this.userInfo.appVersion;
let appVersionNum = appVersion.split('.').join('');
console.log('appVersionNum', appVersionNum);
if(appVersionNum < 341) {
Toast('请您下载新版本App');
return;
}
if (!this.userInfo.userMobile) {
rocNative.gotoLogin();
return;
}
if (window.__isWeb) {
console.log("in jumpToCardList");
return;
} else {
let pageUrl = getWebPageUrl("cme/#/icredit-detail");
let paramList = [
{
key: "pageUrl",
value: `${pageUrl}?provinceId=${this.provinceId}&organizationId=${this.organizationId}&cmeToken=${this.cmeToken}&oneLevelUrl=` + encodeURIComponent(this.oneLevelUrl),
type: 4,
seqNo: 1
}
];
rocNative.dispatchEventByModuleCode({
modeCode: "M300",
jsonString: paramList
});
}
}
}
};
</script>
<style lang="less" scoped>
.I-card-item-wrapper {
// width: 100%;
margin: 0 15px;
.item {
// width: 100%;
display: flex;
height: 72px;
flex-direction: row;
align-content: space-between;
align-items: center;
// box-sizing: border-box;
padding: 0 15px;
background: #f8f9fa;
border-radius: 6px;
.left-icon {
width: 40px;
height: 40px;
margin-right: 15px;
}
.center {
position: relative;
top: -4px;
left: 0;
display: flex;
flex-direction: column;
flex: 1;
height: 40px;
align-content: flex-start;
text-align: left;
.top {
height: 26px;
line-height: 26px;
font-size: 16px;
font-weight: 700;
color: rgba(55, 56, 57, 1);
}
.bottom {
font-size: 14px;
font-weight: 400;
color: rgba(151, 152, 153, 1);
}
}
.right-icon {
width: 15px;
height: 15px;
}
}
}
</style>
\ No newline at end of file
<template> <template>
<div class="basic-container"> <div class="basic-container">
<div class="basic-title">基本信息</div> <div class="basic-title">基本信息</div>
<div class="content"> <!-- <div v-if="projectNo" class="content">
<span>项目编号</span> <span>项目编号</span>
<span>{{projectNo}}</span> <span>{{projectNo}}</span>
</div> -->
<div class="pro-name">
<span class="title">项目名称</span>
<span class="name">{{projectName}}</span>
</div> </div>
<!-- <div class="content"> -->
<!-- <span>学习收获</span>
<span>
{{level}}
<b v-show="cmeType !=2" class="split"></b>
{{ cmeType !=2 ? projectCredit : ''}}
</span> -->
<!-- <span>{{level}} | {{projectCredit}}</span> -->
<!-- </div> -->
<div class="content"> <div class="content">
<span>学习收获</span> <!-- <span>申请范围</span> -->
<span>{{level}} {{projectCredit}}</span> <span>学习范围</span>
</div>
<div class="content">
<span>申请范围</span>
<span>{{scope}}</span> <span>{{scope}}</span>
</div> </div>
<div class="remind" v-if="remind"> <div class="remind" v-if="remind && cmeType != 2">
<span>{{remind}}</span> <span>{{remind}}</span>
</div> </div>
<div class="content"> <div class="content">
...@@ -21,7 +31,10 @@ ...@@ -21,7 +31,10 @@
<span>{{startDate | formatTime('{y}.{m}.{d}')}}{{endDate | formatTime('{y}.{m}.{d}')}}</span> <span>{{startDate | formatTime('{y}.{m}.{d}')}}{{endDate | formatTime('{y}.{m}.{d}')}}</span>
</div> </div>
<div class="content"> <div class="content">
<span>发起机构</span> <!-- <span>{{cmeType == 2 ? '主办单位' : '发起机构'}}</span> -->
<!-- <span>主办单位</span> -->
<!-- <span>申办单位</span> -->
<span>出版单位</span>
<span>{{organName}}</span> <span>{{organName}}</span>
</div> </div>
</div> </div>
...@@ -64,61 +77,102 @@ export default { ...@@ -64,61 +77,102 @@ export default {
projectCredit: { projectCredit: {
type: String, type: String,
default: "" default: ""
},
cmeType: {
type: String | Number,
default: 2
},
projectName: {
type: String,
default: ""
} }
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.basic-container { .basic-container {
padding-bottom: px2rem(20px); padding-bottom: 20px;
margin: px2rem(30px) px2rem(15px) 0px; margin: 30px 15px 0px;
border-bottom: px2rem(1px) solid #E7E8E9; // border-bottom: 1px solid #e7e8e9;
.basic-title { .basic-title {
font-size: px2rem(18px); font-size: 18px;
line-height: px2rem(18px); line-height: 18px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
} }
.pro-name {
display: flex;
flex-direction: row;
margin-top: 16px;
font-size: 14px;
span {
display: flex;
font-size: 14px;
align-items: center;
line-height: 22px;
align-content: flex-start;
text-align: justify;
&.title {
width: 84px;
color: #979899;
}
&.name {
flex: 1;
color: #676869;
}
}
}
.content { .content {
margin-top: px2rem(16px); margin-top: 16px;
height: px2rem(16px); height: 16px;
line-height: px2rem(0px); line-height: 0px;
span { span {
display: inline-block; display: inline-block;
font-size: px2rem(14px); font-size: 14px;
.split {
display: inline-block;
position: relative;
top: 2px;
left: 0;
width: 1px;
height: 13px;
margin: 0 2px;
background: #676869;
}
} }
span:first-child { span:first-child {
color: #979899; color: #979899;
} }
span:last-child { span:last-child {
margin-left: px2rem(15px); margin-left: 15px;
color: #676869; color: #676869;
} }
} }
.remind { .remind {
line-height: px2rem(14px); line-height: 14px;
margin-top: px2rem(10px); margin-top: 10px;
span { span {
position: relative; position: relative;
display: inline-block; display: inline-block;
padding: px2rem(5px) px2rem(10px); padding: 5px 10px;
margin-left: px2rem(78px); margin-left: 78px;
font-size: px2rem(14px); font-size: 14px;
color: #FB5B52; color: #fb5b52;
background: #FCEEED; background: #fceeed;
border-radius: px2rem(4px); border-radius: 4px;
} }
span:after { span:after {
content: ""; content: "";
position: absolute; position: absolute;
left: px2rem(10px); left: 10px;
bottom: px2rem(20px); bottom: 20px;
width: 0; width: 0;
height: 0; height: 0;
border-width: 0 px2rem(8px) px2rem(8px); border-width: 0 8px 8px;
border-style: solid; border-style: solid;
border-color: transparent transparent #FCEEED; border-color: transparent transparent #fceeed;
} }
} }
} }
......
<template>
<section class="bind-cart-wrapper">
<article class="left">
<div class="top">
<!-- <span class="discount">{{cardInfo.costPrice | formatMoney}}</span> -->
<span class="discount">{{(cardInfo.couponPrice || cardInfo.preferentialPrice || cardInfo.costPrice) | formatMoney}}</span>
<span v-show="cardInfo.couponPrice || cardInfo.preferentialPrice" class="price">
<del>原价¥{{cardInfo.costPrice | formatMoney}}</del>
</span>
</div>
<div class="bottom">
<img src="../../images/cme/phrase2/info.png" />
<span>激活或购买后可学习课程</span>
</div>
</article>
<article class="right">
<span class="left" @click="download">APP购买更优惠</span>
</article>
</section>
</template>
<script>
export default {
props: {
cardInfo: {
type: Object,
default: () => {}
}
},
data() {
return {};
},
methods: {
download() {
this.$sendBuriedData({
component_tag: `883#88317`
});
setTimeout(() => {
window.location.href =
"https://a.app.qq.com/o/simple.jsp?pkgname=com.picahealth.yunque";
}, 100);
},
}
};
</script>
<style lang="less" scoped>
.bind-cart-wrapper {
position: fixed;
left: 0;
bottom: 0;
z-index: 100;
width: 100%;
display: flex;
flex-direction: row;
height: 60px;
line-height: 1;
justify-content: space-between;
padding: 10px 15px;
font-size: 14px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.1);
.left {
display: flex;
flex-direction: column;
height: 40px;
line-height: 1;
font-size: 12px;
// align-items: ;
.top {
margin-top: 3px;
height: 24px;
.discount {
color: #fb5b52;
font-size: 18px;
font-weight: 700;
margin-right: 4px;
}
.price {
color: #979899;
}
}
.bottom {
display: flex;
flex-direction: row;
img {
width: 12px;
height: 12px;
margin-left: 1px;
margin-right: 4px;
}
& > span {
font-size: 12px;
color: #979899;
}
}
}
.right {
display: flex;
flex-direction: row;
span {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
width: 138px;
font-size: 14px;
font-weight: 700;
text-align: center;
&.left {
// border: 1px solid rgba(255, 122, 75, 1);
// border-right-style: none;
color: #FFFFFF;
background:linear-gradient(137deg,rgba(255,166,95,1) 0%,rgba(255,122,75,1) 100%);
border-radius: 20px;
}
}
}
}
</style>
<template>
<section class="bind-cart-wrapper">
<article class="left">
<div class="top">
<span class="discount">{{(cardInfo.couponPrice || cardInfo.preferentialPrice || cardInfo.costPrice) | formatMoney}}</span>
<span v-show="cardInfo.couponPrice || cardInfo.preferentialPrice" class="price">
<del>原价¥{{cardInfo.costPrice | formatMoney}}</del>
</span>
</div>
<div class="bottom">
<img src="../../images/cme/phrase2/info.png" />
<span>激活或购买后可学习课程</span>
</div>
</article>
<article class="right">
<span class="left" @click="changeClick">去激活</span>
<span @click="gotoBuy" class="right">去购买</span>
</article>
</section>
</template>
<script>
export default {
props: {
cardInfo: {
type: Object,
default: () => {}
}
},
data() {
return {};
},
methods: {
changeClick(){
this.$sendBuriedData({
component_tag: `883#88324`
});
this.$emit("changeClick")
},
gotoBuy() {
this.$sendBuriedData({
component_tag: `883#88323`
});
this.$emit("gotoBuy");
}
}
};
</script>
<style lang="less" scoped>
.bind-cart-wrapper {
position: fixed;
left: 0;
bottom: 0;
z-index: 100;
width: 100%;
display: flex;
flex-direction: row;
height: 60px;
line-height: 1;
justify-content: space-between;
padding: 10px 15px;
font-size: 14px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.1);
.left {
display: flex;
flex-direction: column;
height: 40px;
line-height: 1;
font-size: 12px;
// align-items: ;
.top {
margin-top: 3px;
height: 24px;
.discount {
color: #fb5b52;
font-size: 18px;
font-weight: 700;
margin-right: 4px;
}
.price {
color: #979899;
}
}
.bottom {
display: flex;
flex-direction: row;
img {
width: 12px;
height: 12px;
margin-left: 1px;
margin-right: 4px;
}
& > span {
font-size: 12px;
color: #979899;
}
}
}
.right {
display: flex;
flex-direction: row;
span {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
width: 80px;
font-size: 14px;
font-weight: 700;
text-align: center;
&.left {
border-radius: 20px 0px 0px 20px;
border: 1px solid rgba(255, 122, 75, 1);
border-right-style: none;
color: #ff7a4b;
}
&.right {
background: linear-gradient(
137deg,
rgba(255, 166, 95, 1) 0%,
rgba(255, 122, 75, 1) 100%
);
border-radius: 0px 20px 20px 0px;
color: #fff;
}
}
}
}
</style>
<template>
<section @click="jumpToCardList" class="card-banner-wrapper">
<article class="left">
<img :class="{'is-android': isAndroid}" src="../../images/cme/phrase2/what.png" alt />
<span>学习项目必须使用学习卡哦~</span>
</article>
<span class="right">购买学习卡</span>
</section>
</template>
<script>
import { getHactiveUrl } from "@/utils/index";
import { mapGetters } from "vuex";
import { Toast } from 'vant';
export default {
data() {
return {
isAndroid: window.__isAndroid,
}
},
props: {
userMobile: {
type: String | Number,
default: ''
}
},
computed: {
...mapGetters(["userInfo"])
},
methods: {
// 跳转到学习卡列表页面
jumpToCardList() {
// 如果没有登录,则要去登录页面
// 打开页面埋点
this.$sendBuriedData({
component_tag: "880#8801"
});
let appVersion = this.userInfo.appVersion;
let appVersionNum = appVersion.split('.').join('');
console.log('appVersionNum', appVersionNum);
if(appVersionNum < 341) {
Toast('请您下载新版本App');
return;
}
if (!this.userMobile) {
rocNative.gotoLogin();
return;
}
if (window.__isWeb) {
console.log("in jumpToCardList");
return;
} else {
let pageUrl = getHactiveUrl("/message_push/#/study-card?origin=1");
let paramList = [
{
key: "pageUrl",
value: pageUrl,
type: 4,
seqNo: 1
}
];
rocNative.dispatchEventByModuleCode({
modeCode: "M300",
jsonString: paramList
});
}
}
}
};
</script>
<style lang="less" scoped>
.card-banner-wrapper {
width: 100%;
height: 40px;
display: flex;
flex-direction: row;
padding: 0 15px;
justify-content: space-between;
align-items: center;
background: #fefaf5;
.left {
display: flex;
height: 40px;
flex-direction: row;
align-items: center;
img {
width: 13px;
height: 13px;
margin-right: 4px;
&.is-android {
width: 12px;
height: 13px;
margin-bottom: 2px;
}
}
span {
font-size: 13px;
color: #e6a23c;
}
}
.right {
height: 25px;
line-height: 25px;
font-size: 12px;
padding: 0 10px;
background: rgba(230, 162, 60, 1);
border-radius: 25px;
border: 1px solid rgba(230, 162, 60, 1);
color: #ffffff;
}
}
</style>
\ No newline at end of file
<template>
<section class="card-popup-wrapper">
<van-popup
v-model="isShow"
position="center"
@click-overlay="clickOverlay"
>
<article class="content">
<p class="title">学分项目必须使用学习卡</p>
<p class="title">请先购买学习卡</p>
<section class="card-info">
<img v-if="cardInfo.cardType == 1" class="icon" src="../../images/cme/phrase2/I-card-icon.png" alt />
<img v-else class="icon" src="../../images/cme/phrase2/II-card-icon.png" alt />
<div class="info2">
<span class="name">{{cardInfo.goodsName}}</span>
<p>
<span class="price">{{(cardInfo.preferentialPrice || cardInfo.costPrice) | formatMoney}}</span><span v-show="cardInfo.preferentialPrice" class="discount"><del> 原价¥{{cardInfo.costPrice | formatMoney}}</del></span>
</p>
</div>
<!-- <div class="info2">
<span class="name">已购买去学习已购买去学购买去学习买</span>
<p>
<span class="price">¥100</span><span class="discount"><del> 原价¥120</del></span>
</p>
</div> -->
</section>
<div class="line"></div>
<div class="btn">
<span class="left" @click="cancle">已购买去学习</span>
<span class="vert-line"></span>
<span class="right" @click="confirm">去购买</span>
</div>
</article>
</van-popup>
</section>
</template>
<script>
import { Popup } from "vant";
export default {
data() {
return {
}
},
props: {
isShow: {
type: Boolean,
default: false,
},
cardInfo: {
id: 10031,
goodsVersion: 1,
cardType: 1,
costPrice: 0,
preferentialPrice: 0,
goodsDesc: "",
goodsName: "学习卡",
goodsType: 2,
isSale: 1,
}
},
methods: {
clickOverlay() {
this.$emit('clickOverlay');
},
cancle() {
this.$emit('cancle');
},
confirm() {
this.$emit('confirm');
}
},
}
</script>
<style lang="less" scoped>
.card-popup-wrapper {
.content {
font-size: 14px;
width: 300px;
// height: 245px;
padding-top: 30px;
.title {
text-align: center;
font-size: 18px;
font-weight: 700;
}
.card-info {
display: flex;
flex-direction: row;
align-items: center;
height: 76px;
margin: 15px;
padding: 0 8px;
background: #F8F9FA;
border-radius: 6px;
font-size: 14px;
.icon {
width: 60px;
height: 60px;
margin-right: 8px;
}
.info {
width: 100%;
position: relative;
top: 0;
left: 0;
.name {
position: absolute;
top: -30px;
left: 4px;
}
p {
position: absolute;
bottom: -34px;
left: 0px;
display: flex;
align-items: center;
.price {
color: #FB5B52;
font-size: 18px;
font-weight: 700;
margin-right: 8px;
}
.discount {
color: #979899;
}
}
}
.info2 {
display: flex;
flex-direction: column;
// .name {
// position: absolute;
// top: -30px;
// left: 4px;
// }
p {
display: flex;
align-items: center;
height: 24px;
line-height: 24px;
.price {
color: #FB5B52;
font-size: 18px;
font-weight: 700;
margin-right: 8px;
}
.discount {
color: #979899;
}
}
}
}
.line {
margin-top: 30px;
height: 1px;
background: #F0F1F2;
}
.btn {
width: 100%;
display: flex;
flex-direction: row;
// justify-content: space-between;
align-items: center;
height: 50px;
// margin-top: 15px;
font-size: 17px;
.left {
flex: 1;
text-align: center;
color: #979899;
// border-right: 1px solid #F0F1F2;
}
.vert-line {
border-right: 1px solid #F0F1F2;
// width: 1px;
height: 100%;
}
.right {
flex: 1;
text-align: center;
color: #449284;
}
}
}
.van-popup.van-popup--center {
border-radius: 4px;
}
}
</style>
<template>
<van-popup
v-model="isShow"
@click-overlay="cancle"
position="bottom"
>
<section class="bind-cart-wrapper">
<article class="title">
<span>激活详情</span>
<img @click="cancle" src="../../images/cme/close.png" />
</article>
<article class="tip">
<div class="left">
<div class="img-wrapper"><img :class="{'android': isAndroid}" src="../../images/cme/phrase2/info.png"/></div>
<span>激活码用于学习课程,您可以从订单详情或您的实体卡查看激活码。激活码一旦使用,不可退回。</span>
</div>
</article>
<section class="input-wrapper">
<div class="code">
<van-field
maxlength="26"
v-model="activationCode"
label="激活码"
placeholder="请输入激活码"
/>
<!-- <span>激活码</span>
<input type="text" maxlength="26" v-model="activationCode" placeholder="请输入激活码"> -->
<div v-show="!isAndroid" class="cover"></div>
</div>
<span class="error">{{errorMsg}}</span>
<img v-show="!!activationCode" @click="clear" src="../../images/cme/phrase2/close.png" />
</section>
<article class="bottom">
<van-button @click="confirm" size="large" round color="#449284">确认激活</van-button>
</article>
</section>
</van-popup>
</template>
<script>
export default {
props: {
isShow: {
type: Boolean,
default: true
},
changeErrorMsg: {
type: String,
default: ''
}
},
data() {
return {
isAndroid: __isAndroid,
activationCode: '',
errorMsg: ''
};
},
//
watch: {
activationCode(val) {
if(!val) {
this.errorMsg = '请输入激活码';
} else {
this.errorMsg = '';
}
this.$nextTick(() => {
this.activationCode = val.replace(/\s/g,'').replace(/.....(?!$)/g,'$& ');
});
},
changeErrorMsg(val) {
if(val) {
this.errorMsg = val;
}
},
isShow(val) {
this.activationCode = '';
this.errorMsg = '';
}
},
methods: {
cancle() {
this.$emit("cancle");
},
confirm() {
this.$sendBuriedData({
component_tag: `883#88325`
});
if(!this.activationCode) {
this.errorMsg = '请输入激活码';
return;
};
if(this.activationCode.length != 23) {
this.errorMsg = '请输入正确的激活码';
return;
}
let aCode = JSON.parse(JSON.stringify(this.activationCode));
aCode = aCode.replace(/\s/g,'');
this.$emit("confirm", aCode);
},
clear() {
this.activationCode = ''
}
}
};
</script>
<style lang="less" scoped>
.bind-cart-wrapper {
width: 100%;
display: flex;
line-height: 1;
padding: 10px 15px;
display: flex;
flex-direction: column;
background: rgba(255, 255, 255, 1);
// box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.1);
.title {
display: flex;
flex-direction: row;
font-size: 18px;
font-weight: 700;
align-items: center;
justify-content: center;
width: 100%;
margin-top: 20px;
img {
position: relative;
top: 0;
right: -120px;
width: 12px;
height: 12px;
}
}
.tip {
display: flex;
margin-top: 40px;
.left {
display: flex;
line-height: 1.2;
font-size: 12px;
.img-wrapper {
width: 20px;
// margin-right: 4px;
img {
position: relative;
top: 1px;
width: 12px;
height: 12px;
}
img.android {
top: 1.5px;
width: 11.5px;
}
}
span {
display: inline-block;
margin-left: 4px;
}
color: #979899;
}
}
.input-wrapper {
position: relative;
.code {
position: relative;
display: flex;
flex-direction: column;
padding: 20px 0;
padding-top: 0;
.cover {
width: 286px;
position: absolute;
top: 21.5px;
z-index: 1000;
border-top: 4px solid #fff;
margin-left: 57px;
margin-right: 1px;
border-radius: 4px;
}
}
.error {
position: absolute;
top: 66px;
left: 56px;
display: inline-block;
color: red;
font-size: 12px;
}
img {
position: absolute;
top: 33px;
right: 12px;
width: 15px;
height: 15px;
}
}
.bottom {
display: flex;
margin-bottom: 40px;
}
}
</style>
\ No newline at end of file
...@@ -74,7 +74,7 @@ export default { ...@@ -74,7 +74,7 @@ export default {
default: "" default: ""
}, },
projectId: { projectId: {
type: String, type: String | Number,
default: "1" default: "1"
}, },
inScope: { inScope: {
...@@ -208,11 +208,10 @@ export default { ...@@ -208,11 +208,10 @@ export default {
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.step-content { .step-content {
position: relative; position: relative;
height: px2rem(110px); height: 110px;
background: rgba(248, 249, 250, 1); background: rgba(248, 249, 250, 1);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
...@@ -221,25 +220,25 @@ export default { ...@@ -221,25 +220,25 @@ export default {
.step-item { .step-item {
flex-grow: 1; flex-grow: 1;
text-align: center; text-align: center;
padding-top: px2rem(20px); padding-top: 20px;
line-height: px2rem(20px); line-height: 20px;
span { span {
display: inline-block; display: inline-block;
width: px2rem(20px); width: 20px;
height: px2rem(20px); height: 20px;
line-height: px2rem(17px); line-height: 17px;
border-radius: 50%; border-radius: 50%;
background: #676869; background: #676869;
border: 2px solid rgba(255, 255, 255, 1); border: 2px solid rgba(255, 255, 255, 1);
color: #fff; color: #fff;
font-size: px2rem(12px); font-size: 12px;
font-weight: 700; font-weight: 700;
} }
span.actived { span.actived {
background: #449284; background: #449284;
} }
p { p {
font-size: px2rem(13px); font-size: 13px;
color: #373839; color: #373839;
} }
p.actived { p.actived {
...@@ -248,19 +247,19 @@ export default { ...@@ -248,19 +247,19 @@ export default {
} }
.step-line { .step-line {
position: absolute; position: absolute;
top: px2rem(58px); top: 58px;
width: px2rem(75px); width: 75px;
height: px2rem(3px); height: 3px;
background: #dadde1; background: #dadde1;
} }
.step-one-line { .step-one-line {
left: px2rem(56px); left: 56px;
} }
.step-two-line { .step-two-line {
left: px2rem(150px); left: 150px;
} }
.step-three-line { .step-three-line {
right: px2rem(56px); right: 56px;
} }
.step-one-line.actived, .step-one-line.actived,
.step-two-line.actived, .step-two-line.actived,
...@@ -269,113 +268,113 @@ export default { ...@@ -269,113 +268,113 @@ export default {
} }
.step-text { .step-text {
position: absolute; position: absolute;
top: px2rem(25px); top: 25px;
padding: px2rem(4px) px2rem(6px); padding: 4px 6px;
background: #449284; background: #449284;
border-radius: px2rem(10px); border-radius: 10px;
font-size: px2rem(12px); font-size: 12px;
line-height: px2rem(12px); line-height: 12px;
color: #fff; color: #fff;
img { img {
display: inline-block; display: inline-block;
width: px2rem(6px); width: 6px;
height: px2rem(9px); height: 9px;
padding-left: px2rem(4px); padding-left: 4px;
} }
} }
.step1-text { .step1-text {
left: px2rem(20px); left: 20px;
} }
.step1-text:after { .step1-text:after {
content: ""; content: "";
width: px2rem(0px); width: 0px;
height: px2rem(0px); height: 0px;
border-top: px2rem(7px) solid #449284; border-top: 7px solid #449284;
border-left: px2rem(7px) solid transparent; border-left: 7px solid transparent;
border-right: px2rem(7px) solid transparent; border-right: 7px solid transparent;
position: absolute; position: absolute;
top: px2rem(18px); top: 18px;
left: px2rem(21px); left: 21px;
} }
.step2-text { .step2-text {
left: px2rem(106px); left: 106px;
} }
.step2-text:after, .step2-text:after,
.step3-text:after { .step3-text:after {
content: ""; content: "";
width: px2rem(0px); width: 0px;
height: px2rem(0px); height: 0px;
border-top: px2rem(7px) solid #449284; border-top: 7px solid #449284;
border-left: px2rem(7px) solid transparent; border-left: 7px solid transparent;
border-right: px2rem(7px) solid transparent; border-right: 7px solid transparent;
position: absolute; position: absolute;
top: px2rem(18px); top: 18px;
left: px2rem(29px); left: 29px;
} }
.step3-text { .step3-text {
left: px2rem(207px); left: 207px;
} }
.step3-text:after { .step3-text:after {
content: ""; content: "";
width: px2rem(0px); width: 0px;
height: px2rem(0px); height: 0px;
border-top: px2rem(7px) solid #449284; border-top: 7px solid #449284;
border-left: px2rem(7px) solid transparent; border-left: 7px solid transparent;
border-right: px2rem(7px) solid transparent; border-right: 7px solid transparent;
position: absolute; position: absolute;
top: px2rem(18px); top: 18px;
left: px2rem(21px); left: 21px;
} }
.step4-text { .step4-text {
right: px2rem(20px); right: 20px;
} }
.step4-text:after { .step4-text:after {
content: ""; content: "";
width: px2rem(0px); width: 0px;
height: px2rem(0px); height: 0px;
border-top: px2rem(7px) solid #449284; border-top: 7px solid #449284;
border-left: px2rem(7px) solid transparent; border-left: 7px solid transparent;
border-right: px2rem(7px) solid transparent; border-right: 7px solid transparent;
position: absolute; position: absolute;
top: px2rem(18px); top: 18px;
right: px2rem(20px); right: 20px;
} }
.apply-score-content { .apply-score-content {
display: flex; display: flex;
position: absolute; position: absolute;
left: px2rem(105px); left: 105px;
top: px2rem(-42px); top: -42px;
background: #000; background: #000;
opacity: 0.6; opacity: 0.6;
width: px2rem(236px); width: 236px;
height: px2rem(51px); height: 51px;
border-radius: px2rem(6px); border-radius: 6px;
.title { .title {
font-size: px2rem(12px); font-size: 12px;
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
margin: px2rem(7px) px2rem(11px) 0 px2rem(0px); margin: 7px 11px 0 0px;
width: px2rem(133px); width: 133px;
} }
.lm { .lm {
width: px2rem(41px); width: 41px;
img { img {
display: inline-block; display: inline-block;
width: px2rem(20px); width: 20px;
padding: 0 0 px2rem(7px) px2rem(15px); padding: 0 0 7px 15px;
} }
} }
.line { .line {
width: px2rem(1px); width: 1px;
height: px2rem(51px); height: 51px;
background: #fff; background: #fff;
opacity: 0.18; opacity: 0.18;
} }
.rm { .rm {
width: px2rem(41px); width: 41px;
img { img {
display: inline-block; display: inline-block;
width: px2rem(15px); width: 15px;
padding: 0 px2rem(15px) px2rem(7px); padding: 0 15px 7px;
} }
} }
} }
......
...@@ -7,8 +7,7 @@ ...@@ -7,8 +7,7 @@
</div> </div>
</div> </div>
</template> </template>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.common-bottom-info-wrapper { .common-bottom-info-wrapper {
position: fixed; position: fixed;
width: 100%; width: 100%;
......
...@@ -27,19 +27,18 @@ export default { ...@@ -27,19 +27,18 @@ export default {
}, },
} }
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.common-button-wrapper { .common-button-wrapper {
font-size: px2rem(14px); font-size: 14px;
margin: px2rem(20px) px2rem(15px); margin: 20px 15px;
text-align: center; text-align: center;
&.button-default { &.button-default {
span { span {
display: block; display: block;
height: px2rem(50px); height: 50px;
line-height: px2rem(50px); line-height: 50px;
width: 100%; width: 100%;
border-radius: px2rem(25px); border-radius: 25px;
font-size: 17px; font-size: 17px;
font-weight: 700; font-weight: 700;
color: #FFFFFF; color: #FFFFFF;
......
...@@ -5,8 +5,8 @@ ...@@ -5,8 +5,8 @@
<div class="dialog-content">{{content}}</div> <div class="dialog-content">{{content}}</div>
<div v-show="needSubContent" class="dialog-sub-content" v-html="subContent"></div> <div v-show="needSubContent" class="dialog-sub-content" v-html="subContent"></div>
<div class="dialog-footer v-hairline-top"> <div class="dialog-footer v-hairline-top">
<span :class="{'single-btn': isSingle}" @click.stop.prevent="handlerAction(1)">{{cancleBtnText}}</span> <span :class="{'single-btn': isSingle}" @click="handlerAction(1)">{{cancleBtnText}}</span>
<span v-show="!isSingle" class="confirm-btn v-hairline-left" @click.stop.prevent="handlerAction(2)">{{confirmBtnText}}</span> <span v-show="!isSingle" class="confirm-btn v-hairline-left" @click="handlerAction(2)">{{confirmBtnText}}</span>
</div> </div>
</div> </div>
</div> </div>
...@@ -56,8 +56,7 @@ export default { ...@@ -56,8 +56,7 @@ export default {
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.common-dialog-wrraper { .common-dialog-wrraper {
position: fixed; position: fixed;
top: 0; top: 0;
...@@ -79,35 +78,35 @@ export default { ...@@ -79,35 +78,35 @@ export default {
top: 50%; top: 50%;
left: 50%; left: 50%;
overflow: hidden; overflow: hidden;
width: px2rem(300px); width: 300px;
font-size: px2rem(18px); font-size: 18px;
-webkit-transition: 0.3s; -webkit-transition: 0.3s;
transition: 0.3s; transition: 0.3s;
border-radius: px2rem(4px); border-radius: 4px;
background-color: #fff; background-color: #fff;
-webkit-transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0);
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
backface-visibility: hidden; backface-visibility: hidden;
.dialog-content { .dialog-content {
// margin: px2rem(30px) px2rem(22px); // margin: 30px 22px;
margin: px2rem(30px); margin: 30px;
text-align: center; text-align: center;
font-size: px2rem(18px); font-size: 18px;
font-weight: 400; font-weight: 400;
color: #373839; color: #373839;
} }
.dialog-sub-content { .dialog-sub-content {
margin: px2rem(-16px) px2rem(30px) px2rem(30px); margin: -16px 30px 30px;
// margin: px2rem(-16px) px2rem(22px) px2rem(30px); // margin: -16px 22px 30px;
text-align: left; text-align: left;
font-size: px2rem(14px); font-size: 14px;
line-height: px2rem(24px); line-height: 24px;
font-weight: 400; font-weight: 400;
color: #676869; color: #676869;
} }
.dialog-footer { .dialog-footer {
height: px2rem(50px); height: 50px;
display: flex; display: flex;
align-items: center; align-items: center;
&.v-hairline-top::after { &.v-hairline-top::after {
...@@ -117,9 +116,9 @@ export default { ...@@ -117,9 +116,9 @@ export default {
display: inline-block; display: inline-block;
// width: 50%; // width: 50%;
flex: 1; flex: 1;
height: px2rem(50px); height: 50px;
line-height: px2rem(50px); line-height: 50px;
font-size: px2rem(17px); font-size: 17px;
text-align: center; text-align: center;
color: #979899; color: #979899;
&.v-hairline-left::after { &.v-hairline-left::after {
...@@ -151,5 +150,11 @@ export default { ...@@ -151,5 +150,11 @@ export default {
border: 0 solid #f0f1f2; border: 0 solid #f0f1f2;
} }
} }
&.shikan {
.dialog-sub-content {
text-align: center;
font-size: 16px;
}
}
} }
</style> </style>
<template>
<div class="exjumper-button-wrapper button-default" :class="type" @click="btnClick">
<span>{{btnText}}</span>
</div>
</template>
<script>
export default {
props: {
btnText: {
type: String,
default: '确定'
},
type: {
type: String,
default: 'primary'
}
},
data() {
return {
}
},
methods: {
btnClick() {
if(this.type == 'disabled') return;
this.$emit('btnClick');
}
},
}
</script>
<style lang="less" scoped>
.exjumper-button-wrapper {
position: fixed;
left: 0;
bottom: 0;
right: 0;
z-index: 1000;
font-size: 14px;
padding: 20px 15px;
background: linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
text-align: center;
&.button-default {
span {
display: block;
height: 50px;
line-height: 50px;
width: 100%;
border-radius: 25px;
font-size: 17px;
font-weight: 700;
color: #FFFFFF;
background: #449284;
}
}
&.primary {
span {
color: #FFFFFF;
background: #449284;
}
}
&.disabled {
span {
color: rgba(255, 255, 255, 0.95);
background: #C7C8C9;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="exjumper-dialog-wrraper" v-if="isShowDialog">
<div class="dialog-mask"></div>
<div class="dialog-container">
<div class="title" v-html="title"></div>
<!-- <div class="dialog-content">{{content}}</div> -->
<div class="sub-wrapper">
<div v-show="needSubContent" class="dialog-sub-content">1.跳转后点击“购买学习”,注册登录“中华医学教育在线”平台(首次登录需用手机号注册)</div>
<img class="dialog-img-1" src="https://file.yunqueyi.com/h5/images/tinified/II-tips-1.png" alt="">
<div v-show="needSubContent" class="dialog-sub-content">2.支付方式选择 “学习卡支付”,输入您的学习卡激活码,即可参加考试、申请学分。</div>
<img class="dialog-img-2" src="https://file.yunqueyi.com/h5/images/tinified/II-tips-2.png" alt="">
</div>
<div class="dialog-footer v-hairline-top">
<span :class="{'single-btn': isSingle}" @click.stop.prevent="handlerAction(1)">{{cancleBtnText}}</span>
<span v-show="!isSingle" class="confirm-btn v-hairline-left" @click.stop.prevent="handlerAction(2)">{{confirmBtnText}}</span>
</div>
</div>
</div>
</template>
<script>
export default {
name: "common-dialog",
data() {
return {
};
},
props: {
title: {
type: String,
default: '即将打开<br/> “中华医学教育在线”平台'
},
content: {
type: String,
default: ''
},
needSubContent: {
type: Boolean,
default: false
},
subContent: {
type: String,
default: ''
},
cancleBtnText: {
type: String,
default: '取消'
},
confirmBtnText: {
type: String,
default: '确定'
},
isShowDialog: {
type: Boolean,
default: false
},
isSingle: {
type: Boolean,
default: false
},
},
methods: {
handlerAction(type) {
this.$emit("handlerAction", type);
},
}
};
</script>
<style lang="less" scoped>
.exjumper-dialog-wrraper {
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
z-index: 2019;
.dialog-mask {
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 2020;
}
.dialog-container {
z-index: 2021;
position: absolute;
top: 50%;
left: 50%;
overflow: hidden;
width: 300px;
font-size: 18px;
-webkit-transition: 0.3s;
transition: 0.3s;
border-radius: 4px;
background-color: #fff;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
.title {
margin: 30px 0 20px;
text-align: center;
font-size: 18px;
font-weight: 700;
color: #373839;
}
.dialog-content {
// margin: 30px 22px;
margin: 20px 16px 30px;
text-align: left;
font-size: 14px;
font-weight: 400;
color: #373839;
}
.sub-wrapper {
margin-right: 5px;
max-height: 300px;
overflow: auto;
.dialog-sub-content {
margin: 0 8px 20px 16px;
text-align: left;
font-size: 14px;
line-height: 24px;
font-weight: 400;
color: #979899;
}
.dialog-img-1 {
width: 268px;
height: 165px;
margin-left: 16px;
margin-bottom: 20px;
}
.dialog-img-2 {
width: 268px;
height: 145px;
margin-left: 16px;
margin-bottom: 20px;
}
&::-webkit-scrollbar-track-piece {
background-color: rgba(0, 0, 0, 0);
border-left: 1px solid rgba(0, 0, 0, 0);
}
&::-webkit-scrollbar {
width: 5px;
height: 13px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
&::-webkit-scrollbar-thumb {
background-color: #C7C8C9;
background-clip: padding-box;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
min-height: 28px;
}
&::-webkit-scrollbar-thumb:hover {
background-color: #C7C8C9;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
}
.dialog-footer {
height: 50px;
display: flex;
align-items: center;
&.v-hairline-top::after {
border-top-width: 1px;
}
span {
display: inline-block;
// width: 50%;
flex: 1;
height: 50px;
line-height: 50px;
font-size: 17px;
text-align: center;
color: #979899;
&.v-hairline-left::after {
border-left-width: 1px;
}
&.confirm-btn {
color: #449284;
}
&.single-btn {
color: #449284;
}
}
}
}
[class*="v-hairline"] {
position: relative;
&::after {
content: " ";
position: absolute;
pointer-events: none;
box-sizing: border-box;
top: -50%;
left: -50%;
right: -50%;
bottom: -50%;
-webkit-transform: scale(0.5);
transform: scale(0.5);
border: 0 solid #f0f1f2;
}
}
}
</style>
...@@ -40,41 +40,40 @@ export default { ...@@ -40,41 +40,40 @@ export default {
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.item-intro-container { .item-intro-container {
padding-bottom: px2rem(20px); padding-bottom: 20px;
margin: px2rem(30px) px2rem(15px) 0px; margin: 30px 15px 0px;
border-bottom: px2rem(1px) solid #E7E8E9; border-bottom: 1px solid #E7E8E9;
.basic-title { .basic-title {
font-size: px2rem(18px); font-size: 18px;
line-height: px2rem(18px); line-height: 18px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
} }
.content { .content {
position: relative; position: relative;
margin-top: px2rem(16px); margin-top: 16px;
.text { .text {
font-size: px2rem(14px); font-size: 14px;
line-height: px2rem(21px); line-height: 21px;
color: #676869; color: #676869;
} }
.desc { .desc {
// position: absolute; // position: absolute;
// right: 0; // right: 0;
// bottom: px2rem(1px); // bottom: 1px;
text-align: right; text-align: right;
background: #fff; background: #fff;
line-height: px2rem(14px); line-height: 14px;
z-index: 99; z-index: 99;
span { span {
font-size: px2rem(14px); font-size: 14px;
line-height: px2rem(14px); line-height: 14px;
color: #449284; color: #449284;
} }
img { img {
width: px2rem(12px); width: 12px;
} }
} }
} }
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
</div> </div>
</div> </div>
<div class="content"> <div class="content">
<div class="text">{{leaderText}}</div> <div class="text" v-html="leaderText"></div>
<div v-if="leaderText.length > 70" class="desc" @click="allText"> <div v-if="leaderText.length > 70" class="desc" @click="allText">
<span>{{btnText}}</span> <span>{{btnText}}</span>
<img v-if="!allTextFlag" src="../../images/down.png" /> <img v-if="!allTextFlag" src="../../images/down.png" />
...@@ -53,58 +53,60 @@ export default { ...@@ -53,58 +53,60 @@ export default {
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.item-leader-container { .item-leader-container {
padding-bottom: px2rem(20px); padding-bottom: 20px;
margin: px2rem(30px) px2rem(15px) 0px; margin: 30px 15px 0px;
border-bottom: px2rem(1px) solid #e7e8e9; border-bottom: 1px solid #e7e8e9;
.basic-title { .basic-title {
font-size: px2rem(18px); font-size: 18px;
line-height: px2rem(18px); line-height: 18px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
} }
.leader-info { .leader-info {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin-top: px2rem(16px); margin-top: 16px;
img { img {
display: inline-block; display: inline-block;
width: px2rem(44px); width: 44px;
height: px2rem(44px); height: 44px;
border-radius: 50%; border-radius: 50%;
} }
.leader-text { .leader-text {
margin-left: px2rem(16px); flex: 1;
margin-top: px2rem(6px); width: 100px;
margin-left: 16px;
margin-top: 6px;
.leader-con { .leader-con {
line-height: px2rem(14px); line-height: 14px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
white-space: nowrap;
span { span {
font-size: px2rem(16px); font-size: 16px;
color: #676869; color: #676869;
} }
span:first-child { span:first-child {
font-size: px2rem(16px); font-size: 16px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
} }
.leader-title { .leader-title {
width: px2rem(220px); width: 220px;
overflow : hidden; overflow : hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space:nowrap; white-space:nowrap;
line-height: px2rem(16px); line-height: 16px;
margin-left: px2rem(10px); margin-left: 10px;
} }
} }
.address { .address {
margin-top: px2rem(5px); margin-top: 5px;
font-size: px2rem(13px); font-size: 13px;
color: #979899; color: #979899;
width: px2rem(240px); width: 240px;
overflow : hidden; overflow : hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space:nowrap; white-space:nowrap;
...@@ -113,26 +115,26 @@ export default { ...@@ -113,26 +115,26 @@ export default {
} }
.content { .content {
position: relative; position: relative;
margin-top: px2rem(16px); margin-top: 16px;
.text { .text {
font-size: px2rem(14px); font-size: 14px;
line-height: px2rem(21px); line-height: 21px;
color: #676869; color: #676869;
} }
.desc { .desc {
// position: absolute; // position: absolute;
// right: 0; // right: 0;
// bottom: px2rem(1px); // bottom: 1px;
text-align: right; text-align: right;
background: #fff; background: #fff;
line-height: px2rem(14px); line-height: 14px;
z-index: 99; z-index: 99;
span { span {
font-size: px2rem(14px); font-size: 14px;
color: #449284; color: #449284;
} }
img { img {
width: px2rem(12px); width: 12px;
} }
} }
} }
......
...@@ -16,22 +16,22 @@ export default { ...@@ -16,22 +16,22 @@ export default {
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.learn-know-container { .learn-know-container {
margin: px2rem(30px) px2rem(15px) px2rem(20px); margin: 30px 15px 20px;
.basic-title { .basic-title {
font-size: px2rem(18px); font-size: 18px;
line-height: px2rem(18px); line-height: 18px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
} }
.content { .content {
margin-top: px2rem(16px); margin-top: 16px;
line-height: px2rem(21px); line-height: 21px;
span { span {
display: inline-block; display: inline-block;
font-size: px2rem(14px); text-align: justify;
font-size: 14px;
color: #676869; color: #676869;
} }
} }
......
<template> <template>
<div class="teacter-intro-container"> <div class="teacter-intro-container">
<div class="basic-title">讲师介绍</div> <div class="basic-title">讲师介绍</div>
<div class="leader-info" v-for="(item,index) in doctorList" :key="index"> <div class="leader-info" v-for="(item,index) in current" :key="index">
<img :src="item.appImageUrl"/> <img :src="item.appImageUrl" />
<div class="leader-text"> <div class="leader-text">
<div class="leader-con"> <div class="leader-con">
<span>{{item.name}}</span> <span>{{item.name}}</span>
...@@ -11,6 +11,11 @@ ...@@ -11,6 +11,11 @@
<div class="address">{{item.hospital}}</div> <div class="address">{{item.hospital}}</div>
</div> </div>
</div> </div>
<div v-show="doctorList.length > 1" class="toggle-btn" @click="toggle">
<span class="btn">{{ isUp ? '展开更多' : '向上收起'}}</span>
<img v-if="isUp" src="../../images/cme/arrow-grey-down.png" />
<img v-if="!isUp" src="../../images/cme/arrow-grey-up.png" />
</div>
</div> </div>
</template> </template>
<script> <script>
...@@ -23,75 +28,110 @@ export default { ...@@ -23,75 +28,110 @@ export default {
}, },
data() { data() {
return { return {
isUp: true,
} one: [],
}, all: [],
created() { current: []
};
}, },
created() {},
mounted() { mounted() {
this.one = this.doctorList.slice(0, 1);
this.current = this.one;
this.all = this.doctorList.slice(0);
}, },
methods: { methods: {
toggle() {
this.isUp = !this.isUp;
if (this.isUp) {
this.$sendBuriedData({
component_tag: `883#88322`
});
this.current = this.one;
} else {
this.$sendBuriedData({
component_tag: `883#88321`
});
this.current = this.all;
} }
} }
}
};
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.teacter-intro-container { .teacter-intro-container {
margin: px2rem(30px) px2rem(15px) 0px; margin: 30px 15px 0px;
.basic-title { .basic-title {
font-size: px2rem(18px); font-size: 18px;
line-height: px2rem(18px); line-height: 18px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
} }
.leader-info { .leader-info {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin-top: px2rem(16px); margin-top: 16px;
padding-bottom: px2rem(16px); padding-bottom: 16px;
img { img {
display: inline-block; display: inline-block;
width: px2rem(44px); width: 44px;
height: px2rem(44px); height: 44px;
border-radius: 50%; border-radius: 50%;
} }
.leader-text { .leader-text {
margin-left: px2rem(16px); flex: 1;
margin-top: px2rem(6px); width: 100px;
margin-left: 16px;
margin-top: 6px;
.leader-con { .leader-con {
line-height: px2rem(14px); line-height: 14px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
white-space: nowrap;
span { span {
font-size: px2rem(16px); font-size: 16px;
color: #676869; color: #676869;
} }
span:first-child { span:first-child {
font-size: px2rem(16px); font-size: 16px;
color: #373839; color: #373839;
font-weight: 700; font-weight: 700;
line-height: 1.1;
} }
.leader-title { .leader-title {
width: px2rem(220px); width: 220px;
overflow : hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space:nowrap; white-space: nowrap;
line-height: px2rem(16px); line-height: 16px;
margin-left: px2rem(10px); margin-left: 10px;
} }
} }
.address { .address {
margin-top: px2rem(5px); margin-top: 5px;
font-size: px2rem(13px); font-size: 13px;
color: #979899; color: #979899;
width: px2rem(240px); width: 240px;
overflow : hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space:nowrap; white-space: nowrap;
}
}
}
.toggle-btn {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
margin-bottom: 20px;
& > span {
font-size: 14px;
color: #979899;
font-weight: 400;
} }
& > img {
width: 15px;
height: 15px;
} }
} }
} }
......
<template>
<div class="common-adert-wrapper">
<img :class="{'margin-top-20': needPadTop}" v-if="showInfo.imageUrl" @click="jumpPage" :src="showInfo.imageUrl" alt="">
</div>
</template>
<script>
import { EMLINK } from 'constants';
export default {
name: 'common-title',
data() {
return {
isWeb: window.__isWeb,
showInfo: {
imageUrl: '',
jumpUrl: ''
}
};
},
props: {
advertInfoList: {
type: Array,
default: () => []
},
position: {
type: String | Number,
default: 0
},
needPadTop: {
type: Boolean,
default: false
}
},
watch: {
advertInfoList: {
handler (list) {
list.forEach(element => {
if(element.position == this.position) {
this.showInfo = element;
}
});
},
deep: true
}
},
created() {},
mounted() {
},
computed: {
},
methods: {
// 广告位跳转
jumpPage() {
// if(this.isWeb) {
// window.location.href = this.showInfo.jumpUrl;
// return;
// }
let paramList = [
{
key: "pageUrl",
value: this.showInfo.jumpUrl,
type: 4,
seqNo: 1
}
]
rocNative.dispatchEventByModuleCode({
modeCode: "M300",
jsonString: paramList
});
}
}
};
</script>
<style lang="less" scoped>
.common-adert-wrapper {
img {
width: 100%;
// padding: 10px 0;
// height: 60px;
}
.margin-top-20 {
margin-top: 20px;
}
}
</style>
...@@ -65,10 +65,9 @@ export default { ...@@ -65,10 +65,9 @@ export default {
methods: {} methods: {}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="less" scoped>
@import "../../style/mixin";
.comp-title { .comp-title {
display: flex; display: flex;
padding-left: px2rem(15px); padding-left: 15px;
} }
</style> </style>
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册