Skip to content

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

修改引用配置

上级 0ff27d72
显示空白字符变更
内嵌 并排
正在显示 包含 8594 行增加 和 10796 行删除
.babelrc
浏览文件 @ 97d3ff26
{
"presets": ["env", "es2015", "stage-2"],
"presets": [
"@babel/preset-env"
],
"plugins": [
"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
}
build/webpack.base.conf.js
浏览文件 @ 97d3ff26
......@@ -40,7 +40,7 @@ module.exports = {
loader: 'vue'
}, {
test: /\.js$/,
loader: 'babel',
loader: 'babel-loader',
include: projectRoot,
exclude: /node_modules/
}, {
......@@ -69,6 +69,15 @@ module.exports = {
postcss: [
require('autoprefixer')({
browsers: ['last 10 versions']
}),
require('postcss-pxtorem')({
rootValue: 37.5,
unitPrecision: 5,
propWhiteList: [],
selectorBlackList: [/^html$/],
replace: true,
mediaQuery: false,
minPixelValue: 2
})
]
}
......
package-lock.json
浏览文件 @ 97d3ff26
因为 它太大了无法显示 源差异 。您可以改为 查看blob。
package.json
浏览文件 @ 97d3ff26
......@@ -15,19 +15,11 @@
"build:pro": "cross-env BUILD_ENV=pro node build/build.js"
},
"dependencies": {
"@babel/polyfill": "^7.2.5",
"@babel/polyfill": "^7.10.4",
"axios": "0.16.2",
"better-scroll": "^0.1.15",
"clipboard": "^2.0.6",
"echarts": "^4.2.0-rc.2",
"fastclick": "^1.0.6",
"img-vuer": "^0.17.2",
"install": "^0.13.0",
"iscroll": "^5.2.0",
"js-cookie": "^2.2.0",
"npm": "^6.14.6",
"pdfjs-dist": "^2.4.456",
"pica-topic-stencil": "^1.0.8",
"showdown": "^1.6.4",
"vant": "^2.2.15",
"vconsole": "^3.3.4",
"vue": "^2.1.0",
......@@ -36,19 +28,27 @@
"web-buried-point": "^2.1.0"
},
"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-loader": "^3.2.0",
"babel-core": "^6.0.0",
"babel-loader": "^6.0.0",
"babel-core": "^7.0.0-bridge.0",
"babel-loader": "7.1.1",
"babel-plugin-add-module-exports": "^1.0.0",
"babel-plugin-component": "^1.1.1",
"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",
"connect-history-api-fallback": "^1.1.0",
"cross-env": "^5.0.0",
......@@ -64,13 +64,9 @@
"less": "^2.7.1",
"less-loader": "^2.2.3",
"node-gyp": "^3.4.0",
"node-sass": "^4.9.2",
"opn": "^4.0.2",
"ora": "^0.3.0",
"sass": "^0.5.0",
"sass-loader": "^4.1.1",
"scss": "^0.2.4",
"scss-loader": "0.0.1",
"postcss-pxtorem": "^5.1.1",
"semver": "^5.3.0",
"shelljs": "^0.7.4",
"style-loader": "^0.13.1",
......
src/App.vue
浏览文件 @ 97d3ff26
......@@ -22,7 +22,7 @@
</script>
<style lang="scss">
<style lang="less">
@import './style/mixin';
@import './style/common';
@import './style/global';
......
src/components/business/back-top.vue
浏览文件 @ 97d3ff26
......@@ -44,15 +44,14 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.back-btn {
position: fixed;
width: px2rem(35px);
height: px2rem(35px);
right: px2rem(15px);
width: 35px;
height: 35px;
right: 15px;
z-index: 100;
bottom: px2rem(80px);
bottom: 80px;
img {
width: 100%;
height: 100%;
......
src/components/business/cell-list-detail.vue
浏览文件 @ 97d3ff26
......@@ -366,20 +366,19 @@ export default {
};
</script>
<style lang="scss">
@import "../../style/mixin";
<style lang="less">
.van-dialog {
transform: translate(-50%,-50%);
width: px2rem(300px);
border-radius: px2rem(3px);
width: 300px;
border-radius: 3px;
.van-dialog__header {
padding-top: px2rem(30px);
font-size: px2rem(18px);
padding-top: 30px;
font-size: 18px;
color: #333333;
}
.van-dialog__content {
.van-dialog__message--has-title {
padding-top: px2rem(14px);
padding-top: 14px;
text-align: left;
color: #676869;
font-weight:400;
......@@ -389,7 +388,7 @@ export default {
.van-button {
.van-button__text {
color: #449284;
font-size: px2rem(17px);
font-size: 17px;
}
}
}
......@@ -397,17 +396,17 @@ export default {
.van-toast {
// background: #000000;
div {
font-size:px2rem(12px);
font-size:12px;
color: #FFFFFF;
}
}
.van-toast--text {
padding: px2rem(7px) px2rem(8px);
padding: 7px 8px;
}
.no-more-bottom {
position: relative;
width: 100%;
height: px2rem(40px);
height: 40px;
}
.cell-detail {
.van-hairline--top::after , .van-hairline--top-bottom::after {
......@@ -415,38 +414,38 @@ export default {
}
.van-collapse-item {
.van-cell {
margin: px2rem(9px) auto 0 auto;
width: px2rem(345px);
min-height: px2rem(48px);
border-radius: px2rem(6px);
margin: 9px auto 0 auto;
width: 345px;
min-height: 48px;
border-radius: 6px;
}
.van-collapse-item__title {
background: #F8F9FA;
.van-cell__title {
max-width: px2rem(200px);
max-width: 200px;
vertical-align: middle;
line-height: px2rem(30px);
line-height: 30px;
flex: auto;
span {
color: #373839;
font-weight:500;
font-size: px2rem(15px);
height: px2rem(15px);
line-height: px2rem(15px);
font-size: 15px;
height: 15px;
line-height: 15px;
}
}
.van-cell__value {
// max-width: px2rem(80px);
line-height: px2rem(30px);
// max-width: 80px;
line-height: 30px;
span {
color: #979899;
font-weight:500;
font-size: px2rem(14px);
line-height: px2rem(14px);
font-size: 14px;
line-height: 14px;
}
}
.van-icon {
margin-top: px2rem(3px);
margin-top: 3px;
color: #999999;
}
}
......@@ -456,16 +455,16 @@ export default {
span {
color: #449284;
font-weight:500;
font-size: px2rem(15px);
line-height: px2rem(15px);
font-size: 15px;
line-height: 15px;
}
}
.van-cell__value {
span {
color: #449284;
font-weight:500;
font-size: px2rem(14px);
line-height: px2rem(14px);
font-size: 14px;
line-height: 14px;
}
}
.van-icon {
......@@ -488,84 +487,84 @@ export default {
}
.line-component {
position: relative;
margin-top: px2rem(20px);
margin-top: 20px;
margin-left: 0;
width: px2rem(373px);
height: px2rem(6px);
width: 373px;
height: 6px;
background: #F8F9FA;
}
}
.cell-container {
display: flex;
flex-direction: column;
margin: px2rem(20px) px2rem(0px) px2rem(-28px) px2rem(0px);
margin: 20px 0px -28px 0px;
&-item {
position: relative;
display: flex;
flex-direction: row;
margin-bottom: px2rem(39px);
line-height: px2rem(51px);
font-size: px2rem(15px);
margin-bottom: 39px;
line-height: 51px;
font-size: 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);
margin-right: 6px;
width: 20px;
height: 20px;
float: left;
.img-icon {
position: absolute;
top: 0;
left: 0;
width: px2rem(20px);
height: px2rem(20px);
width: 20px;
height: 20px;
}
}
&-logo {
position: relative;
z-index: 9;
margin-right: px2rem(6px);
width: px2rem(20px);
height: px2rem(20px);
margin-right: 6px;
width: 20px;
height: 20px;
text-align: center;
background:rgba(68,146,132,1);
font-size: px2rem(12px);
font-size: 12px;
font-weight: 700;
color: #FFFFFF;
border-radius: 50%;
float: left;
line-height: px2rem(22px);
line-height: 22px;
// display:table;
// overflow:hidden;
// span {
// color: #FFFFFF;
// font-size: px2rem(12px);
// font-size: 12px;
// font-weight: 700;
// display: table-cell;
// text-align: center;
// vertical-align: middle;
// line-height: px2rem(20px);
// line-height: 20px;
// }
// &::before {
// position: absolute;
// top: px2rem(-6px);
// left: px2rem(8px);
// top: -6px;
// left: 8px;
// display: inline-block;
// height: px2rem(6px);
// width: px2rem(4px);
// height: 6px;
// width: 4px;
// background: #FFFFFF;
// content: "";
// }
// &::after {
// position: absolute;
// top: px2rem(20px);
// left: px2rem(8px);
// top: 20px;
// left: 8px;
// display: inline-block;
// height: px2rem(6px);
// width: px2rem(4px);
// height: 6px;
// width: 4px;
// background: #FFFFFF;
// content: "";
// }
......@@ -578,10 +577,10 @@ export default {
}
&-title {
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
width: px2rem(231px);
font-size: px2rem(15px);
width: 231px;
font-size: 15px;
font-weight: 700;
line-height: px2rem(22px);
line-height: 22px;
color: #333333;
float: left;
}
......@@ -590,73 +589,73 @@ export default {
}
// &::before {
// position: relative;
// top: px2rem(3px);
// top: 3px;
// display: inline-block;
// width: px2rem(4px);
// width: 4px;
// content: "";
// margin-right: px2rem(5px);
// height: px2rem(16px);
// margin-right: 5px;
// height: 16px;
// background: #449284;
// border-radius: px2rem(3px);
// border-radius: 3px;
// }
// span {
// img {
// margin-top: px2rem(4px);
// margin-top: 4px;
// position: relative;
// top: px2rem(2px);
// width: px2rem(70px);
// height: px2rem(20px);
// top: 2px;
// width: 70px;
// height: 20px;
// }
// }
}
.text-action {
width: px2rem(68px);
height: px2rem(25px);
line-height: px2rem(25px);
width: 68px;
height: 25px;
line-height: 25px;
text-align: center;
font-size: px2rem(12px);
font-size: 12px;
font-weight: 700;
border-radius: px2rem(15px);
border: px2rem(1px) solid rgba(68, 146, 132, 0.6);
border-radius: 15px;
border: 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);
left: 2px;
top: 3px;
width: 8px;
height: 12px;
}
&-no {
border: px2rem(1px) solid #c7c8c9;
border: 1px solid #c7c8c9;
color: #c7c8c9;
}
}
.key {
width: px2rem(15px);
height: px2rem(15px);
margin-right: px2rem(20px);
width: 15px;
height: 15px;
margin-right: 20px;
}
}
span {
.cert-img {
margin-left: px2rem(26px);
margin-left: 26px;
position: relative;
top: px2rem(-34px);
width: px2rem(70px);
height: px2rem(20px);
top: -34px;
width: 70px;
height: 20px;
}
.space2 {
top: px2rem(-34px);
top: -34px;
}
}
.connect-line {
position: absolute;
// top: px2rem(32px);
top: px2rem(3px);
left: px2rem(8.5px);
height: px2rem(42px);
width: px2rem(3px);
// top: 32px;
top: 3px;
left: 8.5px;
height: 42px;
width: 3px;
background: #F8F9FA;
// border: 0.5px dashed rgba(240, 241, 244, 1);
}
......@@ -664,40 +663,40 @@ export default {
background: #E3EFED;
}
.len4 {
// height: px2rem(100px);
height: px2rem(106px);
// height: 100px;
height: 106px;
}
.len3 {
// height: px2rem(82px);
height: px2rem(88px);
// height: 82px;
height: 88px;
}
.len2 {
// height: px2rem(82px);
height: px2rem(88px);
// height: 82px;
height: 88px;
}
.len1 {
// height: px2rem(62px);
height: px2rem(68px);
// height: 62px;
height: 68px;
}
.bottom-line {
position: relative;
margin: px2rem(-19px) 0 px2rem(20px) 0;
margin: -19px 0 20px 0;
bottom: 0px;
width: 100%;
height: px2rem(6px);
height: 6px;
background: #F8F9FA;
border-radius: px2rem(2px);
border-radius: 2px;
// border-bottom: 0.5px solid #F0F1F2;
}
.foot-line {
position: absolute;
width: px2rem(311px);
margin-left: px2rem(34.5px);
height: px2rem(1px);
width: 311px;
margin-left: 34.5px;
height: 1px;
background: #E7E8E9;
// border-bottom: 0.5px solid #E7E8E9;
transform: scaleY(0.5);
bottom: px2rem(-20px);
bottom: -20px;
}
}
.bg-13 {
......
src/components/business/cell-list-item.vue
浏览文件 @ 97d3ff26
......@@ -179,70 +179,69 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.cell-container {
display: flex;
flex-direction: column;
margin: 0 px2rem(15px);
margin: 0 15px;
&-item {
position: relative;
display: flex;
flex-direction: row;
// margin: px2rem(6px) px2rem(0px);
// height: px2rem(51px);
margin-bottom: px2rem(32px);
line-height: px2rem(51px);
font-size: px2rem(15px);
// padding: px2rem(0px) px2rem(15px);
// margin: 6px 0px;
// height: 51px;
margin-bottom: 32px;
line-height: 51px;
font-size: 15px;
// padding: 0px 15px;
// background: rgba(248, 249, 250, 1);
// border-bottom: 1px solid #f0f0f0;
// border-radius: px2rem(6px);
// border-radius: 6px;
justify-content: space-between;
align-items: center;
.name {
&-logo {
position: relative;
z-index: 9;
margin-right: px2rem(6px);
width: px2rem(20px);
height: px2rem(20px);
margin-right: 6px;
width: 20px;
height: 20px;
text-align: center;
background:rgba(68,146,132,1);
font-size: px2rem(12px);
font-size: 12px;
font-weight: 700;
color: #FFFFFF;
border-radius: 50%;
float: left;
line-height: px2rem(22px);
line-height: 22px;
// display:table;
// overflow:hidden;
// span {
// color: #FFFFFF;
// font-size: px2rem(12px);
// font-size: 12px;
// font-weight: 700;
// display: table-cell;
// text-align: center;
// vertical-align: middle;
// line-height: px2rem(20px);
// line-height: 20px;
// }
&::before {
position: absolute;
top: px2rem(-6px);
left: px2rem(8px);
top: -6px;
left: 8px;
display: inline-block;
height: px2rem(6px);
width: px2rem(4px);
height: 6px;
width: 4px;
background: #FFFFFF;
content: "";
}
&::after {
position: absolute;
top: px2rem(20px);
left: px2rem(8px);
top: 20px;
left: 8px;
display: inline-block;
height: px2rem(6px);
width: px2rem(4px);
height: 6px;
width: 4px;
background: #FFFFFF;
content: "";
}
......@@ -255,10 +254,10 @@ export default {
}
&-title {
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
width: px2rem(231px);
font-size: px2rem(15px);
width: 231px;
font-size: 15px;
font-weight: 700;
line-height: px2rem(21px);
line-height: 21px;
color: #373839;
float: left;
}
......@@ -267,44 +266,44 @@ export default {
}
// &::before {
// position: relative;
// top: px2rem(3px);
// top: 3px;
// display: inline-block;
// width: px2rem(4px);
// width: 4px;
// content: "";
// margin-right: px2rem(5px);
// height: px2rem(16px);
// margin-right: 5px;
// height: 16px;
// background: #449284;
// border-radius: px2rem(3px);
// border-radius: 3px;
// }
// span {
// img {
// margin-top: px2rem(4px);
// margin-top: 4px;
// position: relative;
// top: px2rem(2px);
// width: px2rem(70px);
// height: px2rem(20px);
// top: 2px;
// width: 70px;
// height: 20px;
// }
// }
}
.text-action {
width: px2rem(68px);
height: px2rem(25px);
line-height: px2rem(25px);
width: 68px;
height: 25px;
line-height: 25px;
text-align: center;
font-size: px2rem(12px);
font-size: 12px;
font-weight: 700;
border-radius: px2rem(15px);
border-radius: 15px;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
// opacity: 0.45;
border: 0.5px 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);
left: 2px;
top: 3px;
width: 8px;
height: 12px;
}
&-no {
border: 0.5px solid #c7c8c9;
......@@ -317,40 +316,40 @@ export default {
}
span {
img {
margin-left: px2rem(26px);
margin-left: 26px;
position: relative;
top: px2rem(-28px);
width: px2rem(70px);
height: px2rem(20px);
top: -28px;
width: 70px;
height: 20px;
}
.space2 {
top: px2rem(-26px);
top: -26px;
}
}
.connect-line {
position: absolute;
// top: px2rem(32px);
top: px2rem(3px);
left: px2rem(9.5px);
height: px2rem(42px);
// top: 32px;
top: 3px;
left: 9.5px;
height: 42px;
width: 0.5px;
border: 0.5px dashed rgba(240, 241, 244, 1);
}
.len4 {
height: px2rem(100px);
height: 100px;
}
.len3 {
height: px2rem(82px);
height: 82px;
}
.len2 {
height: px2rem(82px);
height: 82px;
}
.len1 {
height: px2rem(62px);
height: 62px;
}
.bottom-line {
position: relative;
margin: px2rem(6px) 0 px2rem(28px) 0;
margin: 6px 0 28px 0;
bottom: 0px;
width: 100%;
border-bottom: 0.5px solid #F0F1F2;
......
src/components/business/material-list-item.vue
浏览文件 @ 97d3ff26
......@@ -173,26 +173,25 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.mater-container {
position: relative;
margin: px2rem(0px) px2rem(15px);
margin: 0px 15px;
}
.mater-item {
display: flex;
// width: 100%;
height: px2rem(80px);
height: 80px;
border-bottom: 1px solid #f0f0f0;
background: #fff;
flex-direction: row;
justify-content: space-between;
align-items: center;
img {
width: px2rem(35px);
height: px2rem(37px);
margin-right: px2rem(10px);
border-radius: px2rem(3px) px2rem(2px) px2rem(2px) px2rem(3px);
width: 35px;
height: 37px;
margin-right: 10px;
border-radius: 3px 2px 2px 3px;
}
&-left {
display: flex;
......@@ -201,40 +200,40 @@ export default {
}
&-right {
display: flex;
// width: px2rem(215px);
// width: 215px;
flex: 1;
flex-direction: column;
padding-top: px2rem(4px);
padding-top: 4px;
&-title {
// height: px2rem(50px);
line-height: px2rem(23px);
font-size: px2rem(15px);
// height: 50px;
line-height: 23px;
font-size: 15px;
font-weight: 700;
color: rgba(55, 56, 57, 1);
}
&-other {
height: px2rem(22px);
line-height: px2rem(20px);
font-size: px2rem(13px);
height: 22px;
line-height: 20px;
font-size: 13px;
font-weight: 400;
color: rgba(151, 152, 153, 1);
}
}
.mater-details {
position: relative;
right: px2rem(-10px);
right: -10px;
display: flex;
flex-direction: row;
align-items: center;
span {
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
font-size: px2rem(14px);
font-size: 14px;
font-weight: 700;
color: #666;
}
img {
width: px2rem(15px);
height: px2rem(16px);
width: 15px;
height: 16px;
}
}
}
......
src/components/business/merge-title.vue
浏览文件 @ 97d3ff26
......@@ -97,52 +97,51 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.comp-title-container {
margin-top: px2rem(17px);
padding-left: px2rem(15px);
margin-top: 17px;
padding-left: 15px;
// display: flex;
// flex-direction: row;
// justify-content: space-between;
.comp-text {
position: relative;
width: px2rem(345px);
width: 345px;
overflow: hidden;
}
}
.comp-title {
position: relative;
width: px2rem(238px);
width: 238px;
float: left;
line-height: px2rem(30px);
line-height: 30px;
}
.comp-title-explain {
position: relative;
float: right;
// margin-right: px2rem(15px);
margin-top: px2rem(3px);
// margin-right: 15px;
margin-top: 3px;
span {
font-size: px2rem(14px);
font-size: 14px;
font-weight: 400;
color: rgba(12, 21, 39, 0.4);
// margin-right: px2rem(3px);
line-height: px2rem(18px);
height: px2rem(18px);
// margin-right: 3px;
line-height: 18px;
height: 18px;
vertical-align: middle;
}
img {
width: px2rem(8px);
height: px2rem(12px);
width: 8px;
height: 12px;
vertical-align: middle;
}
}
.cert-img {
margin-top: px2rem(1px);
margin-top: 1px;
.banner-img {
width: px2rem(70px);
height: px2rem(20px);
padding-top: px2rem(2px);
width: 70px;
height: 20px;
padding-top: 2px;
}
}
</style>
src/components/business/no-content.vue
浏览文件 @ 97d3ff26
......@@ -24,27 +24,26 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.nc-container {
display: flex;
width: 100%;
flex-direction: column;
justify-content: center;
align-content: center;
margin-top: px2rem(100px);
margin-bottom: px2rem(20px);
margin-top: 100px;
margin-bottom: 20px;
text-align: center;
// margin: 0 auto;
&-img {
margin-left: px2rem(100px);
width: px2rem(150px);
height: px2rem(150px);
margin-left: 100px;
width: 150px;
height: 150px;
}
&-text {
height: px2rem(21px);
line-height: px2rem(21px);
font-size: px2rem(15px);
height: 21px;
line-height: 21px;
font-size: 15px;
font-weight: 400;
color: rgba(153, 153, 153, 1);
}
......
src/components/business/no-more-content.vue
浏览文件 @ 97d3ff26
......@@ -17,13 +17,12 @@
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.nc-container {
display: flex;
&-content {
width: 100%;
height: px2rem(62px);
height: 62px;
}
}
</style>
......
src/components/business/notice-item.vue
浏览文件 @ 97d3ff26
......@@ -48,49 +48,48 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.item-notice-wrapper {
.content {
display: flex;
flex-direction: row;
height: px2rem(32px);
line-height: px2rem(32px);
padding: 0 px2rem(15px);
height: 32px;
line-height: 32px;
padding: 0 15px;
text-align: left;
align-items: center;
background: #FEFAF5;
img {
width: px2rem(12px);
height: px2rem(12px);
line-height: px2rem(32px);
width: 12px;
height: 12px;
line-height: 32px;
}
span {
font-size: px2rem(13px);
font-size: 13px;
text-align: left;
&.gg {
// width: px2rem(30px);
padding: px2rem(1px) px2rem(5px) 0;
font-size: px2rem(13px);
// width: 30px;
padding: 1px 5px 0;
font-size: 13px;
font-weight: 700;
color: #835800;
}
&.vtc-line {
margin-top: px2rem(0px);
width: px2rem(1px);
height: px2rem(15px);
margin-top: 0px;
width: 1px;
height: 15px;
background: #835800;
}
&.content {
display: block;
flex: 1;
padding-top: px2rem(1px);
// padding-left: px2rem(5px) !important;
padding: 0 px2rem(10px) 0 px2rem(5px);
height: px2rem(32px);
line-height: px2rem(32px);
padding-top: 1px;
// padding-left: 5px !important;
padding: 0 10px 0 5px;
height: 32px;
line-height: 32px;
text-align: left;
font-size: px2rem(13px);
font-size: 13px;
font-weight: 700;
color: #E6A23C;
white-space: nowrap;
......
src/components/business/pop-notice.vue
浏览文件 @ 97d3ff26
......@@ -60,8 +60,7 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.pop-notice-wrapper {
position: fixed;
width: 100%;
......@@ -69,7 +68,7 @@ export default {
left: 0;
top: 0;
z-index: 110;
font-size: px2rem(20px);
font-size: 20px;
.mask {
position: absolute;
background: rgba(0, 0, 0, 0.5);
......@@ -82,19 +81,19 @@ export default {
left: 50%;
top: 50%;
z-index: 112;
width: px2rem(300px);
// height: px2rem(185px);
margin: px2rem(-150px) 0 0 px2rem(-150px);
border-radius: px2rem(3px);
width: 300px;
// height: 185px;
margin: -150px 0 0 -150px;
border-radius: 3px;
text-align: center;
background: #fff;
.top {
padding: px2rem(30px);
padding: 30px;
.title {
display: inline-block;
font-size: px2rem(18px);
line-height: px2rem(28px);
font-size: 18px;
line-height: 28px;
word-break: break-all;
font-weight: 400;
color: #333333;
......@@ -103,10 +102,10 @@ export default {
text-align: left;
word-break: break-all;
display: inline-block;
margin: px2rem(14px) 0;
font-size: px2rem(14px);
height: px2rem(21px);
line-height: px2rem(21px);
margin: 14px 0;
font-size: 14px;
height: 21px;
line-height: 21px;
font-weight: 400;
color: #676869;
.b {
......@@ -115,18 +114,18 @@ export default {
}
}
.line {
width: px2rem(300px);
height: px2rem(1px);
width: 300px;
height: 1px;
background: rgba(240, 241, 242, 1);
}
.bottom {
text-align: center;
font-size: px2rem(17px);
height: px2rem(50px);
line-height: px2rem(50px);
font-size: 17px;
height: 50px;
line-height: 50px;
font-weight: 400;
span {
font-size: px2rem(17px);
font-size: 17px;
color: #449284;
}
}
......
src/components/business/update-dialog.vue
浏览文件 @ 97d3ff26
......@@ -31,8 +31,7 @@ export default {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.dialog-mask-container{
position: fixed;
top: 0;
......@@ -54,24 +53,24 @@ export default {
top: 50%;
left: 50%;
overflow: hidden;
width: px2rem(300px);
font-size: px2rem(18px);
width: 300px;
font-size: 18px;
-webkit-transition: .3s;
transition: .3s;
border-radius: px2rem(4px);
border-radius: 4px;
background-color: #fff;
-webkit-transform: translate3d(-50%,-50%,0);
transform: translate3d(-50%,-50%,0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
.dialog-content{
padding: px2rem(30px) px2rem(22px);
padding: 30px 22px;
text-align: center;
font-size: px2rem(18px);
font-size: 18px;
color: #373839;
}
.dialog-footer{
height: px2rem(50px);
height: 50px;
display: flex;
align-items: center;
&.v-hairline-top::after{
......@@ -80,9 +79,9 @@ export default {
span{
display: inline-block;
width: 50%;
height: px2rem(50px);
line-height: px2rem(50px);
font-size: px2rem(17px);
height: 50px;
line-height: 50px;
font-size: 17px;
text-align: center;
color: #979899;
&.v-hairline-left::after{
......
src/components/cme/basic-info.vue
浏览文件 @ 97d3ff26
......@@ -69,32 +69,31 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.basic-container {
padding-bottom: px2rem(20px);
margin: px2rem(30px) px2rem(15px) 0px;
border-bottom: px2rem(1px) solid #e7e8e9;
padding-bottom: 20px;
margin: 30px 15px 0px;
border-bottom: 1px solid #e7e8e9;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
font-size: 18px;
line-height: 18px;
color: #373839;
font-weight: 700;
}
.pro-name {
display: flex;
flex-direction: row;
margin-top: px2rem(16px);
font-size: px2rem(14px);
margin-top: 16px;
font-size: 14px;
span {
display: flex;
font-size: px2rem(14px);
font-size: 14px;
align-items: center;
line-height: px2rem(22px);
line-height: 22px;
align-content: flex-start;
text-align: justify;
&.title {
width: px2rem(84px);
width: 84px;
color: #979899;
}
&.name {
......@@ -104,20 +103,20 @@ export default {
}
}
.content {
margin-top: px2rem(16px);
height: px2rem(16px);
line-height: px2rem(0px);
margin-top: 16px;
height: 16px;
line-height: 0px;
span {
display: inline-block;
font-size: px2rem(14px);
font-size: 14px;
.split {
display: inline-block;
position: relative;
top: px2rem(2px);
top: 2px;
left: 0;
width: px2rem(1px);
height: px2rem(13px);
margin: 0 px2rem(2px);
width: 1px;
height: 13px;
margin: 0 2px;
background: #676869;
}
}
......@@ -125,33 +124,33 @@ export default {
color: #979899;
}
span:last-child {
margin-left: px2rem(15px);
margin-left: 15px;
color: #676869;
}
}
.remind {
line-height: px2rem(14px);
margin-top: px2rem(10px);
line-height: 14px;
margin-top: 10px;
span {
position: relative;
display: inline-block;
padding: px2rem(5px) px2rem(10px);
margin-left: px2rem(78px);
font-size: px2rem(14px);
padding: 5px 10px;
margin-left: 78px;
font-size: 14px;
color: #fb5b52;
background: #fceeed;
border-radius: px2rem(4px);
border-radius: 4px;
}
span:after {
content: "";
position: absolute;
left: px2rem(10px);
bottom: px2rem(20px);
left: 10px;
bottom: 20px;
width: 0;
height: 0;
border-width: 0 px2rem(8px) px2rem(8px);
border-width: 0 8px 8px;
border-style: solid;
border-color: transparent transparent #fceeed;
}
......
src/components/cme/bind-card-button.vue
浏览文件 @ 97d3ff26
......@@ -39,8 +39,7 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.bind-cart-wrapper {
position: fixed;
left: 0;
......@@ -49,28 +48,28 @@ export default {
width: 100%;
display: flex;
flex-direction: row;
height: px2rem(60px);
height: 60px;
line-height: 1;
justify-content: space-between;
padding: px2rem(10px) px2rem(15px);
font-size: px2rem(14px);
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: px2rem(40px);
height: 40px;
line-height: 1;
font-size: 12px;
// align-items: ;
.top {
margin-top: px2rem(3px);
height: px2rem(24px);
margin-top: 3px;
height: 24px;
.discount {
color: #fb5b52;
font-size: px2rem(18px);
font-size: 18px;
font-weight: 700;
margin-right: px2rem(4px);
margin-right: 4px;
}
.price {
color: #979899;
......@@ -80,10 +79,10 @@ export default {
display: flex;
flex-direction: row;
img {
width: px2rem(12px);
height: px2rem(12px);
width: 12px;
height: 12px;
margin-left: 1px;
margin-right: px2rem(4px);
margin-right: 4px;
}
color: #979899;
}
......@@ -96,12 +95,12 @@ export default {
flex-direction: row;
align-items: center;
justify-content: center;
width: px2rem(80px);
font-size: px2rem(14px);
width: 80px;
font-size: 14px;
font-weight: 700;
text-align: center;
&.left {
border-radius: px2rem(20px) 0px 0px px2rem(20px);
border-radius: 20px 0px 0px 20px;
border: 1px solid rgba(255, 122, 75, 1);
border-right-style: none;
color: #ff7a4b;
......@@ -112,7 +111,7 @@ export default {
rgba(255, 166, 95, 1) 0%,
rgba(255, 122, 75, 1) 100%
);
border-radius: 0px px2rem(20px) px2rem(20px) 0px;
border-radius: 0px 20px 20px 0px;
color: #fff;
}
}
......
src/components/cme/card-banner.vue
浏览文件 @ 97d3ff26
......@@ -67,45 +67,44 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.card-banner-wrapper {
width: 100%;
height: px2rem(40px);
height: 40px;
display: flex;
flex-direction: row;
padding: 0 px2rem(15px);
padding: 0 15px;
justify-content: space-between;
align-items: center;
background: #fefaf5;
.left {
display: flex;
height: px2rem(40px);
height: 40px;
flex-direction: row;
align-items: center;
img {
width: px2rem(13px);
height: px2rem(13px);
margin-right: px2rem(4px);
width: 13px;
height: 13px;
margin-right: 4px;
&.is-android {
width: px2rem(12px);
height: px2rem(13px);
margin-bottom: px2rem(2px);
width: 12px;
height: 13px;
margin-bottom: 2px;
}
}
span {
font-size: px2rem(13px);
font-size: 13px;
color: #e6a23c;
}
}
.right {
height: px2rem(25px);
line-height: px2rem(25px);
font-size: px2rem(12px);
padding: 0 px2rem(10px);
height: 25px;
line-height: 25px;
font-size: 12px;
padding: 0 10px;
background: rgba(230, 162, 60, 1);
border-radius: px2rem(25px);
border: px2rem(1px) solid rgba(230, 162, 60, 1);
border-radius: 25px;
border: 1px solid rgba(230, 162, 60, 1);
color: #ffffff;
}
}
......
src/components/cme/change-card.vue
浏览文件 @ 97d3ff26
......@@ -113,13 +113,12 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.bind-cart-wrapper {
width: 100%;
display: flex;
line-height: 1;
padding: px2rem(10px) px2rem(15px);
padding: 10px 15px;
display: flex;
flex-direction: column;
background: rgba(255, 255, 255, 1);
......@@ -132,40 +131,40 @@ export default {
align-items: center;
justify-content: center;
width: 100%;
margin-top: px2rem(20px);
margin-top: 20px;
img {
position: relative;
top: 0;
right: px2rem(-120px);
width: px2rem(12px);
height: px2rem(12px);
right: -120px;
width: 12px;
height: 12px;
}
}
.tip {
display: flex;
margin-top: px2rem(40px);
margin-top: 40px;
.left {
display: flex;
line-height: 1.2;
font-size: px2rem(12px);
font-size: 12px;
.img-wrapper {
width: px2rem(20px);
// margin-right: px2rem(4px);
width: 20px;
// margin-right: 4px;
img {
position: relative;
top: px2rem(1px);
width: px2rem(12px);
height: px2rem(12px);
top: 1px;
width: 12px;
height: 12px;
}
img.android {
top: px2rem(1.5px);
width: px2rem(11.5px);
top: 1.5px;
width: 11.5px;
}
}
span {
display: inline-block;
margin-left: px2rem(4px);
margin-left: 4px;
}
color: #979899;
}
......@@ -176,40 +175,40 @@ export default {
position: relative;
display: flex;
flex-direction: column;
padding: px2rem(20px) 0;
padding: 20px 0;
padding-top: 0;
.cover {
width: px2rem(286px);
width: 286px;
position: absolute;
top: px2rem(21.5px);
top: 21.5px;
z-index: 1000;
border-top: px2rem(4px) solid #fff;
margin-left: px2rem(57px);
margin-right: px2rem(1px);
border-radius: px2rem(4px);
border-top: 4px solid #fff;
margin-left: 57px;
margin-right: 1px;
border-radius: 4px;
}
}
.error {
position: absolute;
top: px2rem(66px);
left: px2rem(56px);
top: 66px;
left: 56px;
display: inline-block;
color: red;
font-size: px2rem(12px);
font-size: 12px;
}
img {
position: absolute;
top: px2rem(33px);
right: px2rem(12px);
width: px2rem(15px);
height: px2rem(15px);
top: 33px;
right: 12px;
width: 15px;
height: 15px;
}
}
.bottom {
display: flex;
margin-bottom: px2rem(40px);
margin-bottom: 40px;
}
}
</style>
src/components/cme/common-bottom-info.vue
浏览文件 @ 97d3ff26
......@@ -8,8 +8,7 @@
</div>
</div>
</template>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.common-bottom-info-wrapper {
position: fixed;
width: 100%;
......
src/components/cme/common-button.vue
浏览文件 @ 97d3ff26
......@@ -27,20 +27,19 @@ export default {
},
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.common-button-wrapper {
font-size: px2rem(14px);
margin: px2rem(20px) px2rem(15px);
font-size: 14px;
margin: 20px 15px;
text-align: center;
&.button-default {
span {
display: block;
height: px2rem(50px);
line-height: px2rem(50px);
height: 50px;
line-height: 50px;
width: 100%;
border-radius: px2rem(25px);
font-size: px2rem(17px);
border-radius: 25px;
font-size: 17px;
font-weight: 700;
color: #FFFFFF;
background: #449284;
......
src/components/cme/common-dialog copy.vue
浏览文件 @ 97d3ff26
......@@ -56,8 +56,7 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.common-dialog-wrraper {
position: fixed;
top: 0;
......@@ -79,35 +78,35 @@ export default {
top: 50%;
left: 50%;
overflow: hidden;
width: px2rem(300px);
font-size: px2rem(18px);
width: 300px;
font-size: 18px;
-webkit-transition: 0.3s;
transition: 0.3s;
border-radius: px2rem(4px);
border-radius: 4px;
background-color: #fff;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
.dialog-content {
// margin: px2rem(30px) px2rem(22px);
margin: px2rem(30px);
// margin: 30px 22px;
margin: 30px;
text-align: center;
font-size: px2rem(18px);
font-size: 18px;
font-weight: 400;
color: #373839;
}
.dialog-sub-content {
margin: px2rem(-16px) px2rem(30px) px2rem(30px);
// margin: px2rem(-16px) px2rem(22px) px2rem(30px);
margin: -16px 30px 30px;
// margin: -16px 22px 30px;
text-align: left;
font-size: px2rem(14px);
line-height: px2rem(24px);
font-size: 14px;
line-height: 24px;
font-weight: 400;
color: #676869;
}
.dialog-footer {
height: px2rem(50px);
height: 50px;
display: flex;
align-items: center;
&.v-hairline-top::after {
......@@ -117,9 +116,9 @@ export default {
display: inline-block;
// width: 50%;
flex: 1;
height: px2rem(50px);
line-height: px2rem(50px);
font-size: px2rem(17px);
height: 50px;
line-height: 50px;
font-size: 17px;
text-align: center;
color: #979899;
&.v-hairline-left::after {
......
src/components/cme/common-dialog.vue
浏览文件 @ 97d3ff26
......@@ -56,8 +56,7 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.common-dialog-wrraper {
position: fixed;
top: 0;
......@@ -79,35 +78,35 @@ export default {
top: 50%;
left: 50%;
overflow: hidden;
width: px2rem(300px);
font-size: px2rem(18px);
width: 300px;
font-size: 18px;
-webkit-transition: 0.3s;
transition: 0.3s;
border-radius: px2rem(4px);
border-radius: 4px;
background-color: #fff;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
.dialog-content {
// margin: px2rem(30px) px2rem(22px);
margin: px2rem(30px);
// margin: 30px 22px;
margin: 30px;
text-align: center;
font-size: px2rem(18px);
font-size: 18px;
font-weight: 400;
color: #373839;
}
.dialog-sub-content {
margin: px2rem(-16px) px2rem(30px) px2rem(30px);
// margin: px2rem(-16px) px2rem(22px) px2rem(30px);
margin: -16px 30px 30px;
// margin: -16px 22px 30px;
text-align: left;
font-size: px2rem(14px);
line-height: px2rem(24px);
font-size: 14px;
line-height: 24px;
font-weight: 400;
color: #676869;
}
.dialog-footer {
height: px2rem(50px);
height: 50px;
display: flex;
align-items: center;
&.v-hairline-top::after {
......@@ -117,9 +116,9 @@ export default {
display: inline-block;
// width: 50%;
flex: 1;
height: px2rem(50px);
line-height: px2rem(50px);
font-size: px2rem(17px);
height: 50px;
line-height: 50px;
font-size: 17px;
text-align: center;
color: #979899;
&.v-hairline-left::after {
......@@ -154,7 +153,7 @@ export default {
&.shikan {
.dialog-sub-content {
text-align: center;
font-size: px2rem(16px);
font-size: 16px;
}
}
}
......
src/components/cme/exjumper-button.vue
浏览文件 @ 97d3ff26
......@@ -27,26 +27,25 @@ export default {
},
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.exjumper-button-wrapper {
position: fixed;
left: 0;
bottom: 0;
right: 0;
z-index: 1000;
font-size: px2rem(14px);
padding: px2rem(20px) px2rem(15px);
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: px2rem(50px);
line-height: px2rem(50px);
height: 50px;
line-height: 50px;
width: 100%;
border-radius: px2rem(25px);
font-size: px2rem(17px);
border-radius: 25px;
font-size: 17px;
font-weight: 700;
color: #FFFFFF;
background: #449284;
......
src/components/cme/exjumper-dialog.vue
浏览文件 @ 97d3ff26
......@@ -66,8 +66,7 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.exjumper-dialog-wrraper {
position: fixed;
top: 0;
......@@ -89,54 +88,54 @@ export default {
top: 50%;
left: 50%;
overflow: hidden;
width: px2rem(300px);
font-size: px2rem(18px);
width: 300px;
font-size: 18px;
-webkit-transition: 0.3s;
transition: 0.3s;
border-radius: px2rem(4px);
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: px2rem(30px) 0 px2rem(20px);
margin: 30px 0 20px;
text-align: center;
font-size: px2rem(18px);
font-size: 18px;
font-weight: 700;
color: #373839;
}
.dialog-content {
// margin: px2rem(30px) px2rem(22px);
margin: px2rem(20px) px2rem(16px) px2rem(30px);
// margin: 30px 22px;
margin: 20px 16px 30px;
text-align: left;
font-size: px2rem(14px);
font-size: 14px;
font-weight: 400;
color: #373839;
}
.sub-wrapper {
margin-right: px2rem(5px);
max-height: px2rem(300px);
margin-right: 5px;
max-height: 300px;
overflow: auto;
.dialog-sub-content {
margin: 0 px2rem(8px) px2rem(20px) px2rem(16px);
margin: 0 8px 20px 16px;
text-align: left;
font-size: px2rem(14px);
line-height: px2rem(24px);
font-size: 14px;
line-height: 24px;
font-weight: 400;
color: #979899;
}
.dialog-img-1 {
width: px2rem(268px);
height: px2rem(165px);
margin-left: px2rem(16px);
margin-bottom: px2rem(20px);
width: 268px;
height: 165px;
margin-left: 16px;
margin-bottom: 20px;
}
.dialog-img-2 {
width: px2rem(268px);
height: px2rem(145px);
margin-left: px2rem(16px);
margin-bottom: px2rem(20px);
width: 268px;
height: 145px;
margin-left: 16px;
margin-bottom: 20px;
}
&::-webkit-scrollbar-track-piece {
......@@ -144,30 +143,30 @@ export default {
border-left: 1px solid rgba(0, 0, 0, 0);
}
&::-webkit-scrollbar {
width: px2rem(5px);
height: px2rem(13px);
-webkit-border-radius: px2rem(3px);
-moz-border-radius: px2rem(3px);
border-radius: px2rem(3px);
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: px2rem(3px);
-moz-border-radius: px2rem(3px);
border-radius: px2rem(3px);
min-height: px2rem(28px);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
min-height: 28px;
}
&::-webkit-scrollbar-thumb:hover {
background-color: #C7C8C9;
-webkit-border-radius: px2rem(3px);
-moz-border-radius: px2rem(3px);
border-radius: px2rem(3px);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
}
.dialog-footer {
height: px2rem(50px);
height: 50px;
display: flex;
align-items: center;
&.v-hairline-top::after {
......@@ -177,9 +176,9 @@ export default {
display: inline-block;
// width: 50%;
flex: 1;
height: px2rem(50px);
line-height: px2rem(50px);
font-size: px2rem(17px);
height: 50px;
line-height: 50px;
font-size: 17px;
text-align: center;
color: #979899;
&.v-hairline-left::after {
......
src/components/cme/item-intro.vue
浏览文件 @ 97d3ff26
......@@ -40,41 +40,40 @@ export default {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.item-intro-container {
padding-bottom: px2rem(20px);
margin: px2rem(30px) px2rem(15px) 0px;
border-bottom: px2rem(1px) solid #E7E8E9;
padding-bottom: 20px;
margin: 30px 15px 0px;
border-bottom: 1px solid #E7E8E9;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
font-size: 18px;
line-height: 18px;
color: #373839;
font-weight: 700;
}
.content {
position: relative;
margin-top: px2rem(16px);
margin-top: 16px;
.text {
font-size: px2rem(14px);
line-height: px2rem(21px);
font-size: 14px;
line-height: 21px;
color: #676869;
}
.desc {
// position: absolute;
// right: 0;
// bottom: px2rem(1px);
// bottom: 1px;
text-align: right;
background: #fff;
line-height: px2rem(14px);
line-height: 14px;
z-index: 99;
span {
font-size: px2rem(14px);
line-height: px2rem(14px);
font-size: 14px;
line-height: 14px;
color: #449284;
}
img {
width: px2rem(12px);
width: 12px;
}
}
}
......
src/components/cme/item-leader.vue
浏览文件 @ 97d3ff26
......@@ -53,58 +53,57 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.item-leader-container {
padding-bottom: px2rem(20px);
margin: px2rem(30px) px2rem(15px) 0px;
border-bottom: px2rem(1px) solid #e7e8e9;
padding-bottom: 20px;
margin: 30px 15px 0px;
border-bottom: 1px solid #e7e8e9;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
font-size: 18px;
line-height: 18px;
color: #373839;
font-weight: 700;
}
.leader-info {
display: flex;
flex-direction: row;
margin-top: px2rem(16px);
margin-top: 16px;
img {
display: inline-block;
width: px2rem(44px);
height: px2rem(44px);
width: 44px;
height: 44px;
border-radius: 50%;
}
.leader-text {
margin-left: px2rem(16px);
margin-top: px2rem(6px);
margin-left: 16px;
margin-top: 6px;
.leader-con {
line-height: px2rem(14px);
line-height: 14px;
display: flex;
flex-direction: row;
span {
font-size: px2rem(16px);
font-size: 16px;
color: #676869;
}
span:first-child {
font-size: px2rem(16px);
font-size: 16px;
color: #373839;
font-weight: 700;
}
.leader-title {
width: px2rem(220px);
width: 220px;
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
line-height: px2rem(16px);
margin-left: px2rem(10px);
line-height: 16px;
margin-left: 10px;
}
}
.address {
margin-top: px2rem(5px);
font-size: px2rem(13px);
margin-top: 5px;
font-size: 13px;
color: #979899;
width: px2rem(240px);
width: 240px;
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
......@@ -113,26 +112,26 @@ export default {
}
.content {
position: relative;
margin-top: px2rem(16px);
margin-top: 16px;
.text {
font-size: px2rem(14px);
line-height: px2rem(21px);
font-size: 14px;
line-height: 21px;
color: #676869;
}
.desc {
// position: absolute;
// right: 0;
// bottom: px2rem(1px);
// bottom: 1px;
text-align: right;
background: #fff;
line-height: px2rem(14px);
line-height: 14px;
z-index: 99;
span {
font-size: px2rem(14px);
font-size: 14px;
color: #449284;
}
img {
width: px2rem(12px);
width: 12px;
}
}
}
......
src/components/cme/learn-know.vue
浏览文件 @ 97d3ff26
......@@ -16,23 +16,22 @@ export default {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.learn-know-container {
margin: px2rem(30px) px2rem(15px) px2rem(20px);
margin: 30px 15px 20px;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
font-size: 18px;
line-height: 18px;
color: #373839;
font-weight: 700;
}
.content {
margin-top: px2rem(16px);
line-height: px2rem(21px);
margin-top: 16px;
line-height: 21px;
span {
display: inline-block;
text-align: justify;
font-size: px2rem(14px);
font-size: 14px;
color: #676869;
}
}
......
src/components/cme/teacter-intro.vue
浏览文件 @ 97d3ff26
......@@ -37,58 +37,57 @@ export default {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.teacter-intro-container {
margin: px2rem(30px) px2rem(15px) 0px;
margin: 30px 15px 0px;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
font-size: 18px;
line-height: 18px;
color: #373839;
font-weight: 700;
}
.leader-info {
display: flex;
flex-direction: row;
margin-top: px2rem(16px);
padding-bottom: px2rem(16px);
margin-top: 16px;
padding-bottom: 16px;
img {
display: inline-block;
width: px2rem(44px);
height: px2rem(44px);
width: 44px;
height: 44px;
border-radius: 50%;
}
.leader-text {
margin-left: px2rem(16px);
margin-top: px2rem(6px);
margin-left: 16px;
margin-top: 6px;
.leader-con {
line-height: px2rem(14px);
line-height: 14px;
display: flex;
flex-direction: row;
span {
font-size: px2rem(16px);
font-size: 16px;
color: #676869;
}
span:first-child {
font-size: px2rem(16px);
font-size: 16px;
color: #373839;
font-weight: 700;
line-height: 1.1;
}
.leader-title {
width: px2rem(220px);
width: 220px;
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
line-height: px2rem(16px);
margin-left: px2rem(10px);
line-height: 16px;
margin-left: 10px;
}
}
.address {
margin-top: px2rem(5px);
font-size: px2rem(13px);
margin-top: 5px;
font-size: 13px;
color: #979899;
width: px2rem(240px);
width: 240px;
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
......
src/components/common/common-advert-img.vue
浏览文件 @ 97d3ff26
......@@ -68,16 +68,15 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.common-adert-wrapper {
img {
width: 100%;
// padding: px2rem(10px) 0;
// height: px2rem(60px);
// padding: 10px 0;
// height: 60px;
}
.margin-top-20 {
margin-top: px2rem(20px);
margin-top: 20px;
}
}
</style>
src/components/common/common-banner-img.vue
浏览文件 @ 97d3ff26
......@@ -65,10 +65,9 @@ export default {
methods: {}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.comp-title {
display: flex;
padding-left: px2rem(15px);
padding-left: 15px;
}
</style>
src/components/common/common-banner-video.vue
浏览文件 @ 97d3ff26
......@@ -84,10 +84,9 @@ export default {
methods: {}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.comp-title {
display: flex;
padding-left: px2rem(15px);
padding-left: 15px;
}
</style>
src/components/common/common-description.vue
浏览文件 @ 97d3ff26
......@@ -51,18 +51,17 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.desc-container {
padding: px2rem(20px) px2rem(15px);
padding: 20px 15px;
.desc-title {
display: flex;
padding-bottom: 0px;
line-height: px2rem(22px);
line-height: 22px;
font-weight: 700;
span {
font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
font-size: px2rem(18px);
font-size: 18px;
font-weight: 700;
color: #333333;
}
......@@ -71,13 +70,13 @@ export default {
display: flex;
position: relative;
word-break: normal;
// margin-bottom: px2rem(40px);
// height: px2rem(60px);
// margin-bottom: 40px;
// height: 60px;
.desc_text {
padding-top: px2rem(6px);
font-size: px2rem(13px);
padding-top: 6px;
font-size: 13px;
color: #676869;
line-height: px2rem(25px);
line-height: 25px;
letter-spacing: 1px;
word-wrap: break-word;
word-break: break-all;
......
src/components/common/common-loading.vue
浏览文件 @ 97d3ff26
......@@ -17,8 +17,7 @@
</template>
<style lang="scss" scoped>
@import '../../style/mixin';
<style lang="less" scoped>
.loader {
&-mask {
position: fixed;
......@@ -31,8 +30,8 @@
}
svg {
position: fixed;
top: px2rem(280px);
left: px2rem(166px);
top: 280px;
left: 166px;
z-index: 9999;
}
}
......
src/components/common/common-navbar-old.vue
浏览文件 @ 97d3ff26
......@@ -124,23 +124,22 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.back {
position: absolute;
left: px2rem(8px);
top: px2rem(15px);
left: 8px;
top: 15px;
display: inline-block;
width: px2rem(50px);
height: px2rem(50px);
width: 50px;
height: 50px;
img {
padding: px2rem(10px);
width: px2rem(25px);
height: px2rem(25px);
padding: 10px;
width: 25px;
height: 25px;
}
}
.nav-top {
// height: px2rem(65px);
// height: 65px;
background: #fff;
color: #333;
position: relative;
......@@ -148,10 +147,10 @@ export default {
.nav-back {
display: inline-block;
position: absolute;
left: px2rem(16px);
left: 16px;
top: 0;
height: px2rem(25px);
width: px2rem(25px);
height: 25px;
width: 25px;
// -ms-transform: translate(180deg);
// -webkit-transform: (180deg);
// transform: rotate(180deg);
......@@ -172,33 +171,33 @@ export default {
}
.nav-share {
position: absolute;
right: px2rem(16px);
right: 16px;
top: 0;
height: px2rem(25px);
width: px2rem(25px);
height: 25px;
width: 25px;
}
.nav-title {
position: relative;
top: px2rem(10px);
top: 10px;
left: 0;
display: inline-block;
width: 100%;
/* padding:0 px2rem(33px);*/
height: px2rem(36px);
/* padding:0 33px;*/
height: 36px;
&-title {
height: px2rem(18px);
font-size: px2rem(18px);
height: 18px;
font-size: 18px;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: px2rem(26px);
line-height: 26px;
}
}
.nav-part {
width: 100%;
font-size: px2rem(18px);
font-size: 18px;
text-align: center;
padding: 0 0 px2rem(10px) 0;
/* height: px2rem(25px);*/
padding: 0 0 10px 0;
/* height: 25px;*/
}
}
......@@ -207,6 +206,6 @@ export default {
top: 0;
left: 0;
border-bottom: 1px solid #e7e7e7;
/* height: px2rem(25px);*/
/* height: 25px;*/
}
</style>
src/components/common/common-navbar.vue
浏览文件 @ 97d3ff26
......@@ -138,23 +138,22 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.back {
position: absolute;
left: px2rem(px);
top: px2rem(15px);
left: px;
top: 15px;
display: inline-block;
width: px2rem(50px);
height: px2rem(50px);
width: 50px;
height: 50px;
img {
padding: px2rem(10px);
width: px2rem(25px);
height: px2rem(25px);
padding: 10px;
width: 25px;
height: 25px;
}
}
.nav-top {
// height: px2rem(65px);
// height: 65px;
background: #fff;
color: #333;
position: relative;
......@@ -162,12 +161,12 @@ export default {
.nav-back {
display: inline-block;
position: absolute;
left: px2rem(0px);
left: 0px;
top: 0;
height: px2rem(25px);
width: px2rem(55px);
padding-left: px2rem(15px);
padding-right: px2rem(15px);
height: 25px;
width: 55px;
padding-left: 15px;
padding-right: 15px;
// -ms-transform: translate(180deg);
// -webkit-transform: (180deg);
// transform: rotate(180deg);
......@@ -188,33 +187,33 @@ export default {
}
.nav-share {
position: absolute;
right: px2rem(16px);
right: 16px;
top: 0;
height: px2rem(25px);
width: px2rem(25px);
height: 25px;
width: 25px;
}
.nav-title {
position: relative;
top: px2rem(10px);
top: 10px;
left: 0;
display: inline-block;
width: 100%;
/* padding:0 px2rem(33px);*/
height: px2rem(36px);
/* padding:0 33px;*/
height: 36px;
&-title {
height: px2rem(18px);
font-size: px2rem(18px);
height: 18px;
font-size: 18px;
font-weight: 700;
color: rgba(51, 51, 51, 1);
line-height: px2rem(26px);
line-height: 26px;
}
}
.nav-part {
width: 100%;
font-size: px2rem(18px);
font-size: 18px;
text-align: center;
padding: 0 0 px2rem(10px) 0;
/* height: px2rem(25px);*/
padding: 0 0 10px 0;
/* height: 25px;*/
}
}
......@@ -223,6 +222,6 @@ export default {
top: 0;
left: 0;
border-bottom: 1px solid #e7e7e7;
/* height: px2rem(25px);*/
/* height: 25px;*/
}
</style>
src/components/common/common-splite-line.vue
浏览文件 @ 97d3ff26
......@@ -23,8 +23,7 @@ export default {
methods: {}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.split-line {
display: flex;
}
......
src/components/common/common-tcplayer copy.vue
浏览文件 @ 97d3ff26
......@@ -124,11 +124,10 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.banner-img {
// display: inherit;
width: px2rem(375px);
height: px2rem(210px);
width: 375px;
height: 210px;
}
</style>
src/components/common/common-tcplayer.vue
浏览文件 @ 97d3ff26
......@@ -136,11 +136,10 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.banner-img {
// display: inherit;
width: px2rem(375px);
height: px2rem(210px);
width: 375px;
height: 210px;
}
</style>
src/components/common/common-title.vue
浏览文件 @ 97d3ff26
......@@ -109,10 +109,9 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.comp-title-container {
padding-left: px2rem(15px);
padding-left: 15px;
display: flex;
flex-direction: row;
justify-content: space-between;
......@@ -127,39 +126,39 @@ export default {
display: flex;
flex-direction: row;
align-items: center;
margin-right: px2rem(15px);
margin-right: 15px;
span {
font-size: px2rem(14px);
font-size: 14px;
font-weight: 400;
color: rgba(40, 52, 76, 0.4);
}
img {
width: px2rem(15px);
height: px2rem(16px);
width: 15px;
height: 16px;
}
}
&-explain {
display: flex;
flex-direction: row;
align-items: center;
margin-right: px2rem(15px);
margin-right: 15px;
span {
font-size: px2rem(14px);
font-size: 14px;
font-weight: 400;
color: rgba(40, 52, 76, 0.4);
margin-right: px2rem(3px);
line-height: px2rem(14px);
margin-right: 3px;
line-height: 14px;
}
img {
width: px2rem(8px);
height: px2rem(14px);
width: 8px;
height: 14px;
}
}
}
.banner-img {
width: px2rem(70px);
height: px2rem(20px);
padding-top: px2rem(2px);
width: 70px;
height: 20px;
padding-top: 2px;
}
</style>
src/components/common/common-toast.vue
浏览文件 @ 97d3ff26
......@@ -26,8 +26,7 @@ export default {
},
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.loader {
&-mask {
position: fixed;
......@@ -43,10 +42,10 @@ export default {
width: 100%;
left: 0;
z-index: 301;
bottom: px2rem(30px);
bottom: 30px;
text-align: center;
span {
padding: px2rem(2px) px2rem(10px);
padding: 2px 10px;
background: #eee;
}
}
......
src/components/common/cooperation-tab.vue
浏览文件 @ 97d3ff26
......@@ -67,10 +67,9 @@ export default {
methods: {}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.comp-title {
display: flex;
padding-left: px2rem(15px);
padding-left: 15px;
}
</style>
src/components/course/brief-intro.vue
浏览文件 @ 97d3ff26
<template>
<div class="brief-intro-wrapper">
<TeacherIntro :doctorList="doctorList"></TeacherIntro>
<CourseIntro></CourseIntro>
<CourseHarvest></CourseHarvest>
<CourseIntro :intro="intro"></CourseIntro>
<CourseHarvest :harvest="harvest"></CourseHarvest>
</div>
</template>
<script>
import TeacherIntro from "@/components/course/course-teacher";
import CourseIntro from "@/components/course/course-intro";
import CourseHarvest from "@/components/course/course-harvest";
export default {
components: {
TeacherIntro,
CourseIntro,
CourseHarvest,
},
data() {
return {
doctorList: [
{
id: 973,
name: "左力",
appImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
avatarImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
hospital: "北京大学人民医院",
title: "主任医师",
info: ""
props: {
doctorList: {
type: Array,
default() {
return [];
}
},
{
id: 973,
name: "左力",
appImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
avatarImageUrl:
"https://file.yunqueyi.com/image/png/2020/07/24/20200724175216870-82aae111.png",
hospital: "北京大学人民医院",
title: "主任医师",
info: ""
intro: {
type: String,
default: "",
},
]
};
harvest: {
type: Array,
default() {
return [];
}
}
},
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.brief-intro-wrapper {
}
</style>
src/components/course/common-error-tips.vue
浏览文件 @ 97d3ff26
......@@ -22,22 +22,21 @@ export default {
}
}
</script>
<style lang="scss">
@import "../../style/mixin";
<style lang="less">
.common-error-tips-wrapper {
display: flex;
flex-direction: column;
align-items: center;
padding-top: px2rem(120px);
padding-top: 120px;
img {
width: px2rem(40px);
height: px2rem(40px);
width: 40px;
height: 40px;
}
span {
display: inline-block;
margin-top: px2rem(15px);
font-size: px2rem(16px);
line-height: px2rem(16px);
margin-top: 15px;
font-size: 16px;
line-height: 16px;
font-weight: 700;
color: #111A34;
}
......
src/components/course/common-title.vue
浏览文件 @ 97d3ff26
......@@ -11,14 +11,13 @@ export default {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.common-title-wrapper {
display: inline-block;
height: px2rem(18px);
line-height: px2rem(18px);
margin: px2rem(30px) px2rem(15px) px2rem(15px);
font-size: px2rem(18px);
height: 18px;
line-height: 18px;
margin: 30px 15px 15px;
font-size: 18px;
font-weight: 700;
color: #373839;
}
......
src/components/course/course-button.vue
浏览文件 @ 97d3ff26
......@@ -24,21 +24,20 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.course-button-wrapper {
display: inline-block;
text-align: center;
margin: 0 px2rem(5px);
margin: 0 5px;
&.button-default {
display: inline-block;
padding: 0 px2rem(16px);
padding: 0 16px;
text-align: center;
height: px2rem(30px);
line-height: px2rem(30px);
height: 30px;
line-height: 30px;
// width: 100%;
border-radius: px2rem(15px);
font-size: px2rem(12px);
border-radius: 15px;
font-size: 12px;
font-weight: 700;
color: #ffffff;
background: #449284;
......
src/components/course/course-catalog.vue 0 → 100644
浏览文件 @ 97d3ff26
<template>
<div class="course-catalog">
<div class="chapter-box">
<div class="head">
<div class="name ellipsis">1.糖尿病的诊断与分型</div>
<div class="total">
共4节
<img class="arrow" src="~@/images/course/arrow_down.png" />
</div>
</div>
<div class="lecture-box">
<div class="item">
<img class="icon" src="~@/images/course/array-right.png" />
<div class="info line">
<p class="subname ellipsis">1.糖尿病的诊断</p>
<p class="time">时长: 03:56</p>
</div>
<div class="btn">学习</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
list: {
type: Array,
default() {
return []
}
}
},
mounted() {
},
methods: {
}
};
</script>
<style lang="less" scoped>
.course-catalog{
.chapter-box{
position: relative;
padding: 0 15px;
&::after{
position: absolute;
content: "";
left: 0;
bottom: 0;
width: 200%;
height: 0;
transform: scale(0.5);
transform-origin: left center;
border-bottom: 1px solid #E7E8E9;
}
.head{
display: flex;
height: 50px;
line-height: 50px;
}
.name{
flex: 1;
width: 100px;
font-size: 15px;
}
.total{
position: relative;
color: #A1A2A3;
font-size: 14px;
padding-right: 15px;
}
.arrow{
position: absolute;
right: 0;
top: 19px;
width: 12px;
height: 12px;
transition: all 0.3s;
}
}
.lecture-box{
.item{
position: relative;
display: flex;
padding: 15px 0 15px 30px;
align-items: center;
}
.icon{
position: absolute;
left: 0;
top: 18px;
width: 12px;
}
.info{
position: relative;
flex: 1;
width: 100px;
}
.line{
&::after{
position: absolute;
content: "";
left: 0;
bottom: 0;
width: 200%;
height: 0;
transform: scale(0.5);
transform-origin: left center;
border-bottom: 1px solid #E7E8E9;
}
}
.btn{
position: relative;
width: 60px;
height: 26px;
line-height: 26px;
color: #449284;
font-size: 12px;
text-align: center;
&::after{
position: absolute;
content: "";
left: 0;
top: 0;
width: 200%;
height: 200%;
border: 1px solid #449284;
transform: scale(0.5);
transform-origin: left top;
border-radius: 26px;
}
}
.subname{
color: #676869;
font-size: 15px;
}
.time{
color: #A3A3A3;
font-size: 12px;
margin-top: 8px;
}
}
}
</style>
src/components/course/course-comment.vue
浏览文件 @ 97d3ff26
<template>
<div class="course-comment">
<div class="item" v-for="item in list" :key="item.qaId">
<img class="img" :src="item.imageUrl" alt="头像" />
<div class="item" v-for="(item, index) in comments" :key="index">
<img class="img" :src="item.imageUrl || 'https://file.yunqueyi.com/File/doctor_default.png'" alt="头像" />
<div class="info-box">
<div class="info-user">
<div class="name">{{ item.doctorName }}</div>
<div class="date">{{ item.createTime }}</div>
</div>
<div class="message">{{ item.message }}</div>
<div class="reply-box" v-if="item.aList && item.aList.length">
<div class="reply-item" v-for="child in item.aList" :key="child.qaId">
<div class="reply-box" v-if="item.len">
<div class="reply-item" v-for="child in item.cList" :key="child.qaId">
<div class="reply-user">
<div class="name">{{ child.doctorName }}</div>
<div class="date">{{ child.createTime }}</div>
</div>
<div class="message">{{ child.message }}</div>
</div>
<div class=""></div>
<div class="show-all" v-if="item.len > 2" @click="spreadAll(index)">
{{ item.showAll ? '收起回复' : `查看全部${item.len}条回复` }}
<img class="show-arrow" :class="{'show-arrow-up': item.showAll}" src="~@/images/course/arrow_down.png" alt="箭头" />
</div>
</div>
</div>
</div>
......@@ -34,26 +37,54 @@ export default {
}
},
data() {
return {};
return {
comments: []
};
},
watch: {
list(val) {
this.dealList(val);
}
},
mounted() {
this.dealList(this.list);
},
methods: {
btnClick() {
if (this.type == "disabled") return;
this.$emit("btnClick");
dealList(list) {
this.comments = list.map(item => {
const aList = item.aList || [];
return {
...item,
aList,
len: aList.length,
cList: aList.slice(0, 2),
showAll: false,
}
})
},
spreadAll(index) {
const { ...item } = this.comments[index];
if (item.showAll) {
item.showAll = false;
item.cList = item.aList.slice(0, 2);
} else {
item.showAll = true;
item.cList = item.aList;
}
this.comments.splice(index, 1, item);
}
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.course-comment {
padding: 0 px2rem(15px);
padding: 0 15px;
.item{
position: relative;
display: flex;
font-size: px2rem(14px);
padding: px2rem(20px) 0;
font-size: 14px;
padding: 20px 0;
&::after{
position: absolute;
content: "";
......@@ -68,9 +99,9 @@ export default {
}
.img{
display: block;
width: px2rem(32px);
height: px2rem(32px);
margin-right: px2rem(10px);
width: 32px;
height: 32px;
margin-right: 10px;
}
.info-box{
flex: 1;
......@@ -78,7 +109,7 @@ export default {
}
.info-user, .reply-user{
display: flex;
padding-bottom: px2rem(10px);
padding-bottom: 10px;
.name{
color: #676869;
flex: 1;
......@@ -86,20 +117,39 @@ export default {
}
.date{
color: #979899;
font-size: px2rem(12px);
font-size: 12px;
}
}
.message{
line-height: px2rem(22px);
line-height: 22px;
text-align: justify;
word-break: break-all;
}
.reply-box{
margin-top: px2rem(15px);
padding: 12px;
margin-top: 15px;
padding: 12px 12px 0;
background-color: #F8F9FA;
}
.reply-item{
padding-bottom: px2rem(20px);
padding-bottom: 20px;
}
.show-all{
position: relative;
color: #676869;
text-align: right;
font-size: 12px;
padding: 10px 18px 20px 0;
}
.show-arrow{
position: absolute;
right: 0;
top: 12px;
width: 12px;
height: 12px;
transition: all 0.3s;
}
.show-arrow-up{
transform: rotate(180deg);
}
}
</style>
src/components/course/course-covers.vue
浏览文件 @ 97d3ff26
......@@ -45,22 +45,21 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.course-covers-wrapper {
display: flex;
flex-direction: column;
width: 100%;
height: px2rem(210px);
height: 210px;
background: rgba(0, 0, 0, 0.8);
justify-content: center;
align-content: center;
.tips {
display: inline-block;
margin-bottom: px2rem(15px);
margin-bottom: 15px;
color: #fff;
text-align: center;
font-size: px2rem(15px);
font-size: 15px;
}
.course-button-group {
display: flex;
......
src/components/course/course-harvest.vue
浏览文件 @ 97d3ff26
<template>
<div class="course-harvest-wrapper">
<CommonTitle :title="title"></CommonTitle>
<CommonTitle title="学习收获"></CommonTitle>
<ul class="list-wrapper">
<li class="item">
<span class="name">卫计委《基层全科诊断资质》证书</span>
<span class="btn">查看</span>
</li>
<li class="item">
<span class="name">卫计委《基层全科诊断资质》证书</span>
<span class="btn">查看</span>
</li>
<li class="item">
<span class="name">卫计委《基层全科诊断资质》证书</span>
<span class="btn">查看</span>
<li class="item" v-for="(item, index) in harvest" :key="index">
<span class="name">{{ item.name }}</span>
<span class="btn" @click="onClick(item)">查看</span>
</li>
</ul>
</div>
</template>
<script>
import CommonTitle from "@/components/course/common-title"
import CommonTitle from "@/components/course/common-title";
import { ImagePreview } from 'vant';
export default {
components: {
CommonTitle
},
data() {
return {
title: "学习收获"
props: {
harvest: {
type: Array,
default() {
return [];
}
}
},
methods: {
onClick(item) {
ImagePreview([item.url])
}
},
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.course-harvest-wrapper {
.list-wrapper {
.item {
display: flex;
justify-content: space-between;
height: px2rem(65px);
line-height: px2rem(65px);
margin: 0 px2rem(15px);
height: 65px;
line-height: 65px;
margin: 0 15px;
align-items: center;
border-bottom: 1px solid #E7E8E9;
.name {
font-size: px2rem(15px);
font-size: 15px;
font-weight: 700;
color: #333333;
}
.btn {
display: inline-block;
height: px2rem(25px);
line-height: px2rem(25px);
font-size: px2rem(12px);
height: 25px;
line-height: 25px;
font-size: 12px;
font-weight: 700;
padding: 0 px2rem(18px);
padding: 0 18px;
color: #449284;
border-radius: px2rem(15px);
border-radius: 15px;
border:1px solid rgba(68, 146, 132, 0.45);
}
}
......
src/components/course/course-intro.vue
浏览文件 @ 97d3ff26
......@@ -2,11 +2,11 @@
<div class="course-intro-wrapper">
<CommonTitle></CommonTitle>
<div class="body">
<span class="content" :class="{'ellipsis': isUp}">{{content}}</span>
<p class="content" :class="{'ellipsis': isUp}">{{ intro }}</p>
<div class="toggle-btn" @click="isUp=!isUp">
<span class="action">{{ isUp ? "详情" : "收起"}}</span>
<img v-show="isUp" src="../../images/down.png" alt="">
<img v-show="!isUp" src="../../images/up.png" alt="">
<img v-show="isUp" src="~@/images/down.png" alt="" />
<img v-show="!isUp" src="~@/images/up.png" alt="" />
</div>
</div>
</div>
......@@ -18,9 +18,9 @@ export default {
CommonTitle
},
props: {
content: {
intro: {
type: String,
default: "本课程从三级本课程从三级本课程从1级本课课程从三级本课程从1级本课课程从三级本课程从1级本课程从三级本本课程本课b从三级本课程从三级本课程从1级本课程从三级本课程从三级本课程从三级"
default: ""
}
},
data() {
......@@ -31,18 +31,19 @@ export default {
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.course-intro-wrapper {
.body {
position: relative;
color: #676869;
font-size: px2rem(14px);
padding: 0 px2rem(15px);
font-size: 14px;
padding: 0 15px;
.content {
display: block;
text-align: justify;
line-height: 21px;
&.ellipsis {
height: 63px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
......@@ -54,18 +55,18 @@ export default {
.toggle-btn {
// background: #fff;
position: absolute;
right: px2rem(15px);
right: 15px;
bottom: 0;
display: flex;
align-items: center;
padding-left: px2rem(30px);
padding-left: 30px;
background: -webkit-linear-gradient(left, transparent, #fff 30%);
img {
position: relative;
top: px2rem(1px);
margin-left: px2rem(6px);
width: px2rem(12px);
height: px2rem(7px);
top: 1px;
margin-left: 6px;
width: 12px;
height: 7px;
}
.action {
color: #449284;
......
src/components/course/course-teacher.vue
浏览文件 @ 97d3ff26
......@@ -2,7 +2,7 @@
<div class="course-teacher-wrapper">
<div class="basic-title">讲师介绍</div>
<div class="leader-info" v-for="(item,index) in doctorList" :key="index">
<img :src="item.appImageUrl"/>
<img :src="item.app_image_url" alt="头像" />
<div class="leader-text">
<div class="leader-con">
<span>{{item.name}}</span>
......@@ -21,75 +21,60 @@ export default {
default: () => []
}
},
data() {
return {
}
},
created() {
},
mounted() {
},
methods: {
}
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.course-teacher-wrapper {
padding: px2rem(30px) px2rem(15px) 0px;
padding: 30px 15px 0px;
.basic-title {
font-size: px2rem(18px);
line-height: px2rem(18px);
font-size: 18px;
line-height: 18px;
color: #373839;
font-weight: 700;
}
.leader-info {
display: flex;
flex-direction: row;
margin-top: px2rem(16px);
padding-bottom: px2rem(16px);
margin-top: 16px;
padding-bottom: 16px;
border-bottom: 1px solid #E7E8E9;
img {
display: inline-block;
width: px2rem(44px);
height: px2rem(44px);
width: 44px;
height: 44px;
border-radius: 50%;
}
.leader-text {
margin-left: px2rem(16px);
margin-top: px2rem(6px);
margin-left: 16px;
margin-top: 6px;
.leader-con {
line-height: px2rem(14px);
line-height: 14px;
display: flex;
flex-direction: row;
span {
font-size: px2rem(16px);
font-size: 16px;
color: #676869;
}
span:first-child {
font-size: px2rem(16px);
font-size: 16px;
color: #373839;
font-weight: 700;
line-height: 1.1;
}
.leader-title {
width: px2rem(220px);
width: 220px;
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
line-height: px2rem(16px);
margin-left: px2rem(6px);
line-height: 16px;
margin-left: 6px;
}
}
.hospital {
margin-top: px2rem(5px);
font-size: px2rem(13px);
margin-top: 5px;
font-size: 13px;
color: #979899;
width: px2rem(240px);
width: 240px;
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
......
src/components/course/course-ware.vue 0 → 100644
浏览文件 @ 97d3ff26
<template>
<div class="course-ware"></div>
</template>
<script>
/**
* 版本：v2.4.456
* 需引用ES5
* GlobalWorkerOptions.workerSrc需要一个加载路径
*/
import pdfJS from 'pdfjs-dist/es5/build/pdf';
pdfJS.GlobalWorkerOptions.workerSrc = 'https://cdn.bootcdn.net/ajax/libs/pdf.js/2.4.456/pdf.worker.min.js';
export default {
props: {
url: {
type: String,
default: ""
}
},
watch: {
url(val) {
this.drawPDF();
}
},
mounted() {
this.drawPDF();
},
methods: {
async drawPDF() {
if (!this.url) {
return;
}
try {
const task = pdfJS.getDocument(this.url);
const pdf = await task.promise.then();
let numPages = 0;
if (pdf && pdf._pdfInfo) {
numPages = pdf._pdfInfo.numPages
}
let pageAll = [];
for (let i = 0; i < numPages; i++) {
pageAll.push(pdf.getPage(i + 1).catch(err => ''))
}
const pages = await Promise.all(pageAll);
this.$el.innerHTML = '';
for (let item of pages) {
this.createCanvas(item)
}
} catch(err) {
console.log(err)
}
},
createCanvas(pdfPage) {
let viewport = pdfPage.getViewport({ scale: 1.0 });
let box = document.createElement("div");
box.className = 'canvas-box';
let canvas = document.createElement("canvas");
canvas.width = viewport.width;
canvas.height = viewport.height;
let ctx = canvas.getContext("2d");
let renderTask = pdfPage.render({
canvasContext: ctx,
viewport: viewport,
});
box.appendChild(canvas);
this.$el.appendChild(box);
}
}
};
</script>
<style lang="less" scoped>
.course-ware{
padding-top: 20px;
overflow: hidden;
/deep/ .canvas-box{
position: relative;
padding-bottom: 30px;
}
/deep/ canvas{
display: block;
width: 100%;
}
}
</style>
src/components/course/pica-video.vue
浏览文件 @ 97d3ff26
......@@ -6,13 +6,15 @@
:id="vid"
:src="url"
:poster="poster"
preload
preload="metadata"
webkit-playsinline
playsinline
x5-playsinline="true"
x-webkit-airplay="allow"
x5-video-player-type="h5"
x5-video-player-fullscreen="true"
x5-video-player-type="h5-page"
x5-video-player-fullscreen="false"
mtt-playsinline="true"
controlsList="nodownload"
@loadedmetadata="loadedMetaData"
@timeupdate="onTimeUpdate"
@ended="onEnded"
......@@ -141,10 +143,10 @@ export default {
},
methods: {
togglePlay() {
// if (!this.logged) {
// this.$store.dispatch('goLogin');
// return;
// }
if (!this.logged) {
this.$store.dispatch('goLogin');
return;
}
if (!this.url || !this.enable) {
return;
}
......@@ -352,7 +354,7 @@ export default {
resourceInfo3: lectureId,
resourceType: 1,
status,
systemType: 2,
systemType: 3,
timestamp: Date.now(),
showError: false,
})
......@@ -379,8 +381,7 @@ export default {
}
</script>
<style lang="scss" scoped>
@import "../../style/mixin";
<style lang="less" scoped>
.pica-video{
position: relative;
left: 0;
......@@ -398,6 +399,15 @@ export default {
max-width: 100%;
max-height: 100%;
transform: translate3d(-50%, -50%, 0);
&::-internal-media-controls-download-button {
display: none;
}
&::-webkit-media-controls-enclosure {
overflow: hidden;
}
&::-webkit-media-controls-panel {
width: calc(100% + 30px);
}
}
.video-cover{
position: absolute;
......
src/main.js
浏览文件 @ 97d3ff26
......@@ -6,7 +6,6 @@ import store from './store/'
const mixins = require('@/utils/mixins');
import '@/utils/rem' // 引入自适应
import '@/utils/yqy-bridge' // 移动端服务
// import FastClick from 'fastclick'
import vueFilters from '@/utils/filter';
import BuriedPoint, { sendBuriedData } from 'web-buried-point';
import Vant from 'vant';
......@@ -52,6 +51,18 @@ const router = new VueRouter({
}
})
router.beforeEach((to, from, next) => {
let query = { ...to.query };
// 登录token保存并替换路径
if (query.token && query.token != 'undefined') {
store.dispatch('setToken', query.token);
delete query.token;
next({ path: to.path, query: query, replace: true });
return;
}
next();
})
// 加入混合
Vue.mixin({
...mixins
......
src/store/getters.js
浏览文件 @ 97d3ff26
......@@ -6,5 +6,6 @@ const getters = {
jumpURLForII: state => state.coop.jumpURLForII,
positionInfo: state => state.coop.positionInfo,
organizationInfo: state => state.coop.organizationInfo,
logged: state => !!(state.user.token && state.user.info.id),
}
export default getters
src/store/index.js
浏览文件 @ 97d3ff26
import Vue from 'vue'
import Vuex from 'vuex'
import coop from './modules/coop'
import user from './modules/user'
import getters from './getters'
Vue.use(Vuex)
const store = new Vuex.Store({
modules: {
coop
coop,
user,
},
getters
})
......
src/store/modules/user.js 0 → 100644
浏览文件 @ 97d3ff26
import { Toast } from 'vant';
import fetch from '@/utils/fetch';
import { getBaseUrl } from '@/utils/index'
import { preLoadImg } from '@/utils/index';
import { envConfig } from '@/utils/env-config'
const user = {
state: {
token: localStorage.getItem('token') || '',
info: {}, // 用户信息
},
mutations: {
SET_TOKEN: (state, payload) => {
state.token = payload;
},
SET_USER_INFO: (state, payload) => {
state.info = payload;
},
},
actions: {
// 外部登陆返回设置token
setToken({ commit, dispatch }, params) {
commit('SET_TOKEN', params);
localStorage.setItem('token', params);
dispatch('getUserInfo');
},
// 获取用户信息
async getUserInfo({ state, commit, dispatch }) {
try {
const errCallBack = () => {
dispatch('logout');
Toast('登录失效，请重新登录~')
}
const res = await fetch({
url: getBaseUrl('/account/login/web'),
method: 'get',
headers: { token: state.token }
}).catch(() => {
errCallBack()
});
if (res && res.code === '000000') {
const { certifyDoc, isExist } = res.data;
const picapDoctor = res.data.picapDoctor || {};
if (picapDoctor.id) {
let avatar = picapDoctor.avatar_image_url || '';
let avatarUrl = '';
const img1 = await preLoadImg(`https://test-file.yunqueyi.com${avatar}`).catch(err => console.log(err));
const img2 = await preLoadImg(`https://file.yunqueyi.com${avatar}`).catch(err => console.log(err));
if (img1) {
avatarUrl = img1.src;
}
if (img2) {
avatarUrl = img2.src;
}
picapDoctor.avatar = avatarUrl || 'https://file.yunqueyi.com/File/doctor_default.png';
commit('SET_USER_INFO', { ...picapDoctor, isExist, certifyDoc });
}
} else {
errCallBack()
}
} catch (err) {
console.log(err);
}
},
// 通过登陆
goLogin() {
window.location.href = envConfig[process.env.BUILD_ENV]['phomeDemain'] + "/pica_login?target_url=" + encodeURIComponent(location.href);
},
// 登出
logout({ state, commit }) {
commit('SET_TOKEN', '');
commit('SET_USER_INFO', {});
localStorage.removeItem('token');
},
},
}
export default user;
src/style/common.scss → src/style/common.less
浏览文件 @ 97d3ff26
......@@ -12,7 +12,7 @@ body, div, span, header, footer, nav, section, aside, article, ul, dl, dt, dd, l
font-style: normal;
text-decoration: none;
border: none;
// font-size: px2rem(14px);
// font-size: 14px;
// color: #333;
font-weight: normal;
// font-family: "PingFangSC-Medium", "PingFangSC", "Microsoft Yahei";
......
src/style/global.scss → src/style/global.less
浏览文件 @ 97d3ff26
@import './common.scss';
@import './common.less';
//定位
.relative{
position: relative;
......@@ -25,46 +25,46 @@
text-align: center;
}
.line20{
margin-top: px2rem(10px);
margin-top: 10px;
}
.mb42{
margin-bottom: px2rem(21px);
margin-bottom: 21px;
}
.marginLR40{
margin: 0 px2rem(20px);
margin: 0 20px;
}
.fs10{
font-size: px2rem(10px);
font-size: 10px;
}
.fs11{
font-size: px2rem(11px);
font-size: 11px;
}
.fs13{
font-size: px2rem(13px);
font-size: 13px;
}
.fs14{
font-size: px2rem(14px);
font-size: 14px;
}
.fs22{
font-size: px2rem(11px);
font-size: 11px;
}
.fs24{
font-size: px2rem(12px);
font-size: 12px;
}
.fs26{
font-size: px2rem(13px);
font-size: 13px;
}
.fs28{
font-size: px2rem(14px);
font-size: 14px;
}
.fs32{
font-size: px2rem(16px);
font-size: 16px;
}
.fs30{
font-size: px2rem(15px);
font-size: 15px;
}
.fs50{
font-size: px2rem(25px);
font-size: 25px;
}
.fw{
font-weight: 700;
......@@ -81,12 +81,12 @@
color: #fff;
}
.fs30{
font-size: px2rem(15px);
font-size: 15px;
}
.van-cell {
padding: px2rem(17px) px2rem(15px) !important;
font-size: px2rem(15px) !important;
padding: 17px 15px !important;
font-size: 15px !important;
color: #373839 !important;
}
.van-cell:not(:last-child)::after {
......@@ -96,7 +96,7 @@
text-align: right !important;
}
// .van-hairline--top-bottom::after, .van-hairline-unset--top-bottom::after {
// border-width: px2rem(1px) 0 !important;
// border-width: 1px 0 !important;
// }
// .van-hairline, .van-hairline--surround, .van-hairline--top, .van-hairline--top-bottom {
// position: inherit !important;
......@@ -104,29 +104,29 @@
// .van-hairline--top {
// }
// .van-field__label, .van-field__body {
// height: px2rem(15px) !important;
// line-height: px2rem(15px) !important;
// height: 15px !important;
// line-height: 15px !important;
// }
.van-cell__title span {
font-weight: 700 !important;
}
.bind-cart-wrapper .van-field__control {
border-radius: px2rem(4px);
border-radius: 4px;
border: 1px solid #C7C8C9;
padding: px2rem(7px);
padding: 7px;
text-align: left !important;
}
.bind-cart-wrapper .van-cell__title .van-field__label {
span {
font-size: px2rem(15px) !important;
font-size: 15px !important;
color: #373839 !important;
}
}
.bind-cart-wrapper .van-field__label {
width: px2rem(56px) !important;
padding-top: px2rem(8px);
width: 56px !important;
padding-top: 8px;
}
.bind-cart-wrapper .van-cell {
padding: 0.54rem 0 !important;
......
src/style/mixin.less 0 → 100644
浏览文件 @ 97d3ff26
@blue: #3190e8;
@bc: #e4e4e4;
@fc:#fff;
src/style/mixin.scss 已删除 100644 → 0
浏览文件 @ 0ff27d72
$blue: #3190e8;
$bc: #e4e4e4;
$fc:#fff;
// 背景图片地址和大小
@mixin bis($url) {
background-image: url($url);
background-repeat: no-repeat;
background-size: 100% 100%;
}
@mixin borderRadius($radius) {
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
-ms-border-radius: $radius;
-o-border-radius: $radius;
border-radius: $radius;
}
//定位全屏
@mixin allcover{
position:absolute;
top:0;
right:0;
}
//定位上下左右居中
@mixin center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
//定位上下居中
@mixin ct {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
//定位左右居中
@mixin cl {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
//宽高
@mixin wh($width, $height){
width: $width;
height: $height;
}
//字体大小、行高、字体
@mixin font($size, $line-height, $family: 'Microsoft YaHei') {
font: #{$size}/#{$line-height} $family;
}
//字体大小，颜色
@mixin sc($size, $color){
font-size: $size;
color: $color;
}
//flex 布局和 子元素 对其方式
@mixin fj($type: space-between){
display: flex;
justify-content: $type;
}
@function px2rem($px){
$rem: 37.5px;
@return ($px / $rem) + rem;
}
\ No newline at end of file
src/utils/env-config.js
浏览文件 @ 97d3ff26
......@@ -10,7 +10,7 @@ export const envConfig = {
// apiUrl: 'https://dev-api.yunqueyi.com/',
// webPageUrl: 'https://dev-phome.yunqueyi.com/',
// baseUrl: 'https://dev-sc.yunqueyi.com/',
baseUrl: 'https://dev-sc.yunqueyi.com/',
// //hactiveUrl: 'https://dev-hactive.yunqueyi.com',
// http://dev-hactive.yunqueyi.com/message_push/#/study-card
......@@ -19,10 +19,12 @@ export const envConfig = {
// webPageUrl: 'https://test1-phome.yunqueyi.com/'
// hactiveUrl: 'https://dev-hactive.yunqueyi.com',
baseUrl: 'https://uat-sc.yunqueyi.com/',
// baseUrl: 'https://uat-sc.yunqueyi.com/',
apiUrl: 'https://uat-api.yunqueyi.com/',
webPageUrl: 'https://uat-phome.yunqueyi.com/',
hactiveUrl: 'https://uat-hactive.yunqueyi.com',
phomeDemain: 'https://dev-phome.yunqueyi.com',
fileUrl: 'https://dev-www.yunqueyi.com',
// baseUrl: 'https://sc.yunqueyi.com/',
// apiUrl: 'https://api.yunqueyi.com/',
......@@ -35,23 +37,31 @@ export const envConfig = {
apiUrl: 'https://dev-api.yunqueyi.com/',
webPageUrl: 'https://dev-phome.yunqueyi.com/',
hactiveUrl: 'https://dev-hactive.yunqueyi.com',
phomeDemain: 'https://dev-phome.yunqueyi.com',
fileUrl: 'https://dev-www.yunqueyi.com',
},
test: {
baseUrl: 'https://test1-sc.yunqueyi.com/',
apiUrl: 'https://test1-api.yunqueyi.com/',
webPageUrl: 'https://test1-phome.yunqueyi.com/',
hactiveUrl: 'https://test1-hactive.yunqueyi.com',
phomeDemain: 'https://test1-phome.yunqueyi.com',
fileUrl: 'https://test1-www.yunqueyi.com',
},
uat: {
baseUrl: 'https://uat-sc.yunqueyi.com/',
apiUrl: 'https://uat-api.yunqueyi.com/',
webPageUrl: 'https://uat-phome.yunqueyi.com/',
hactiveUrl: 'https://uat-hactive.yunqueyi.com',
phomeDemain: 'https://uat-phome.yunqueyi.com',
fileUrl: 'https://uat-www.yunqueyi.com',
},
pro: {
baseUrl: 'https://sc.yunqueyi.com/',
apiUrl: 'https://api.yunqueyi.com/',
webPageUrl: 'https://phome.yunqueyi.com/',
hactiveUrl: 'https://hactive.yunqueyi.com',
phomeDemain: 'httpss://phome.yunqueyi.com',
fileUrl: 'https://www.yunqueyi.com',
}
}
src/utils/index.js
浏览文件 @ 97d3ff26
......@@ -23,6 +23,12 @@ export function getHactiveUrl(url) {
return getConfigByEnvType('hactiveUrl') + (url || '')
}
// 获取pdf文件地址
export function getPdfFileUrl(path) {
let base = getConfigByEnvType('fileUrl');
return `${base}/proxyPdf${path}`;
}
// 根据不同环境，生成URL
function getConfigByEnvType(urlType) {
return envConfig[process.env.BUILD_ENV][urlType]
......@@ -168,3 +174,16 @@ export function formatLeftTimeObj(time, hasZero = true) {
s: hasZero ? formatNum(s) : s,
}
}
export function preLoadImg(url) {
return new Promise((resolve, reject) => {
const img = new Image();
img.onload = () => {
resolve(img);
}
img.onerror = () => {
reject();
}
img.src = url;
})
}
src/utils/mixins.js
浏览文件 @ 97d3ff26
......@@ -110,12 +110,14 @@ module.exports = {
// 通用GET请求
GET(api, para, callback, str) {
// debugger
para.token = para.token || this.token || ''
let token = para.token || this.token || this.$store.state.user.token || '';
para.token = token;
let url = api + this.getUrlPara(para)
return fetch({
url: getBaseUrl(url),
method: 'get',
data: para
data: para,
headers: { token }
})
},
......@@ -144,11 +146,13 @@ module.exports = {
// 通用POST请求
POST(api, para, callback) {
para.token = para.token || this.token || '00175A13D70D4234822D90AC3C74202C'
let token = para.token || this.token || this.$store.state.user.token || '';
para.token = token;
return fetch({
url: getBaseUrl(api),
method: 'post',
data: para
data: para,
headers: { token }
})
},
......
src/views/course-detail.vue
浏览文件 @ 97d3ff26
......@@ -7,7 +7,36 @@
<!-- 内容滚动 -->
<div class="scroll-box">
<div class="scroll-content">
<div class="course-info">
<div class="course-title">
<span class="level">
{{ course.typeStr }}
</span>{{ course.courseName }}
</div>
<div class="course-num">
<span>{{ course.joinNum }}</span>人已学 / <span>{{ course.favorNum }}</span>人收藏
</div>
</div>
<!-- tab栏 -->
<div class="tab-box">
<van-sticky :offset-top="videoH">
<div class="tab-inner">
<div
class="tab-item"
:class="{'tab-active': curtTabIdx === index}"
v-for="(tab, index) in tabs"
:key="index"
@click="curtTabIdx=index">
{{ tab.name }}
</div>
<div class="tab-line" :style="{left: `${tabLeft}px`}"></div>
</div>
</van-sticky>
</div>
<brief-intro v-show="curtTabIdx === 0" :doctor-list="doctors" :intro="course.intro" :harvest="harvest" />
<course-catalog v-show="curtTabIdx === 1" />
<course-ware v-show="curtTabIdx === 2" :url="pdfUrl" />
<course-comment v-show="curtTabIdx === 3" :list="qsList" />
</div>
</div>
<!-- 打开、下载App -->
......@@ -27,20 +56,60 @@
<script>
import PicaVideo from '@/components/course/pica-video';
import BriefIntro from '@/components/course/brief-intro';
import CourseCatalog from '@/components/course/course-catalog';
import CourseWare from '@/components/course/course-ware';
import CourseComment from '@/components/course/course-comment';
import Loading from "@/components/common/common-loading";
import { getPdfFileUrl, formatLeftTimeObj } from '@/utils';
export default {
components: {
PicaVideo,
BriefIntro,
CourseCatalog,
CourseWare,
CourseComment,
Loading
},
data() {
return {
course: {}, // 课程
doctors: [], // 医生
harvest: [], // 学习收获
tabs: [
{ name: '简介' },
{ name: '目录' },
{ name: '课件' },
{ name: '讨论' },
],
curtTabIdx: 1,
tabW: 0, // tab的宽度
videoH: 0, // 视频区高度
chapters: [], // 目录
curtLectureId: 0, // 当前播放课件id
pdfUrl: '', // 当前pdf
qsList: [], // 讨论列表
showLoading: false,
};
},
computed: {
tabLeft() {
const num = this.curtTabIdx + 0.5;
return this.tabW * num;
}
},
mounted() {
const { token, info } = this.$store.state.user;
if (token && !info.id) {
this.$store.dispatch('getUserInfo');
}
this.getCourseInfo();
this.getCourseQas();
const { height } = this.$el.querySelector('.video-box').getBoundingClientRect();
const { width } = this.$el.querySelector('.tab-item').getBoundingClientRect();
this.videoH = height;
this.tabW = width;
this.$refs.picaVideo.switchUrl({
url: 'https://video.yunqueyi.com/TNB/002/01_01_APP_SD.mp4',
});
......@@ -52,7 +121,86 @@ export default {
this.GET(`/contents/courses/${courseId}/pcCourseInfo`, { projectId }).then(res => {
this.showLoading = false;
if (res.code == "000000") {
const {
showFlag = 0, // 0可看，10该课程为付费课程-请去App查看，20可试看，激活/购买后才可查看
trySeeFlag = 0, // 1为试看
trySeeTime = 0, // 试看时间
courseHeader = {},
introduction = [],
directory: {
chapters = [], // 目录
lectureResourceList = [], // 课件
lastLecture = {}, // 最后观看记录
},
} = res.data;
let intro = '';
for (let item of introduction) {
if (item.type === 1) { // 医生
this.doctors = item.dataList || [];
}
if (item.type === 2) { // 课程简介
if (item.dataList && item.dataList[0]) {
intro = item.dataList[0]['intro'] || '';
}
}
if (item.type === 4) { // 学习收获
this.harvest = item.dataList || [];
}
}
this.course = { ...courseHeader, intro, showFlag, trySeeFlag, trySeeTime };
const [chaptersAll, curtLecture] = this.getAllChapters(chapters, lectureResourceList, lastLecture);
this.chapters = chaptersAll;
this.curtLectureId = curtLecture.lectureId;
this.pdfUrl = getPdfFileUrl(curtLecture.courseware.filePath);
} else {
this.$toast(res.message);
}
});
},
// 将课件挂在目录上，获取播放id
getAllChapters(chapters, resList, lastLecture) {
const lectureObj = {};
for (let item of resList) {
lectureObj[item.lectureId] = { ...item };
}
let count = 0;
let curtLecture = {};
let unfinished = false;
for (let chapter of chapters) {
for (let lecture of chapter.lectures) {
count += 1;
let lectureId = lecture.lectureId;
if (lectureObj[lectureId]) {
lecture.courseware = lectureObj[lectureId]
}
const num = count < 10 ? `0${count}` : count;
lecture.lectureNameText = `${num}.${lecture.lectureName}`;
lecture.statusText = lecture.progress === 0 ? '未开始' : (lecture.progress === 1 ? '已学习' : `已学${lecture.progress * 100}%`);
const totalTime = formatLeftTimeObj(lecture.totalTime);
const h = totalTime.h === '00' ? '' : `${totalTime.h}:`;
lecture.totalTimeText = `${h}${totalTime.f}:${totalTime.s}`;
if (lastLecture.lectureId) {
if (lastLecture.lectureId === lecture.lectureId) {
curtLecture = { ...lecture, lastTime: lastLecture.lastTime }
}
} else {
// 取第一个未完成的
if (lecture.progress < 1 && !unfinished) {
curtLecture = { ...lecture };
unfinished = true;
}
}
}
}
return [chapters, curtLecture];
},
getCourseQas() {
const { projectId = 797, courseId = 3 } = this.$route.query;
this.showLoading = true;
this.GET(`/contents/courses/v2/${courseId}/qas`, { projectId, pageNo: 1, pageSize: 10 }).then(res => {
this.showLoading = false;
if (res.code == "000000") {
this.qsList = res.data.model && res.data.model.qaPostModel || [];
} else {
this.$toast(res.message);
}
......@@ -66,27 +214,98 @@ export default {
};
</script>
<style lang="scss" scoped>
@import "../style/mixin";
<style lang="less" scoped>
.course-detail{
position: relative;
height: 100%;
padding-top: px2rem(210px);
padding-top: 210px;
box-sizing: border-box;
.video-box{
position: absolute;
left: 0;
top: 0;
width: 100%;
height: px2rem(210px);
height: 210px;
}
.scroll-box{
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
.scroll-content{
padding-bottom: px2rem(60px);
padding-bottom: 60px;
}
.course-info{
padding: 20px 15px;
border-bottom: 6px solid #F8F9FA;
}
.course-title{
line-height: 23px;
font-size: 18px;
font-weight: bold;
.level{
display: inline-block;
color: #fff;
font-weight: normal;
font-size: 12px;
background-color: #6A9FE9;
margin-right: 5px;
transform: translateY(-2px);
padding: 0 3px;
white-space: nowrap;
border-radius: 1px;
}
}
.course-num{
color: #676869;
font-size: 13px;
margin-top: 10px;
span{
color: #373839;
}
}
.tab-box{
height: 50px;
}
.tab-inner{
display: flex;
position: relative;
background-color: #fff;
&::after{
position: absolute;
content: "";
left: 0;
bottom: 0;
width: 200%;
height: 0;
border-bottom: 1px solid #F0F1F2;
transform: scale(0.5);
transform-origin: left center;
}
}
.tab-item{
color: #979899;
font-size: 15px;
width: 60px;
height: 50px;
line-height: 50px;
text-align: center;
}
.tab-active{
color: #373839;
font-weight: bold;
}
.tab-line{
position: absolute;
left: 30px;
bottom: 3px;
width: 10px;
height: 3px;
background-color: #449284;
border-radius: 1.5px;
transform: translate3d(-5px, 0, 0);
transition: left 0.3s;
}
.download-box{
display: flex;
......@@ -95,49 +314,49 @@ export default {
left: 0;
bottom: 0;
width: 100%;
height: px2rem(60px);
height: 60px;
background-color: #fff;
img{
display: block;
width: px2rem(40px);
height: px2rem(40px);
margin: px2rem(10px) px2rem(10px) 0 px2rem(15px);
width: 40px;
height: 40px;
margin: 10px 10px 0 15px;
}
.content{
flex: 1;
width: 50px;
padding-top: px2rem(10px);
padding-top: 10px;
}
.title{
font-size: px2rem(16px);
line-height: px2rem(22px);
font-size: 16px;
line-height: 22px;
}
.sub-title{
color: #717171;
font-size: px2rem(12px);
line-height: px2rem(18px);
font-size: 12px;
line-height: 18px;
}
.btn-download{
color: #449284;
display: inline-block;
height: px2rem(30px);
line-height: px2rem(30px);
font-size: px2rem(14px);
padding: 0 px2rem(15px);
margin-right: px2rem(15px);
height: 30px;
line-height: 30px;
font-size: 14px;
padding: 0 15px;
margin-right: 15px;
border: 1px solid #449284;
border-radius: px2rem(15px);
border-radius: 15px;
}
.btn-open{
color: #fff;
display: inline-block;
height: px2rem(30px);
line-height: px2rem(30px);
font-size: px2rem(14px);
padding: 0 px2rem(15px);
margin-right: px2rem(15px);
height: 30px;
line-height: 30px;
font-size: 14px;
padding: 0 15px;
margin-right: 15px;
background-color: #449284;
border-radius: px2rem(15px);
border-radius: 15px;
}
}
}
......
src/views/index copy.vue
浏览文件 @ 97d3ff26
......@@ -362,71 +362,69 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../style/mixin";
<style lang="less" scoped>
.page-content {
padding-top: px2rem(74px);
padding-top: 74px;
min-height: 100vh;
.body {
// min-height: 90vh;
display: flex;
flex-direction: row;
font-size: px2rem(14px);
font-size: 14px;
color: #676869;
&.body-pt {
padding-top: px2rem(40px);
padding-top: 40px;
}
.left {
width: px2rem(130px);
width: 130px;
background: #fff;
li {
position: relative;
display: block;
height: px2rem(60px);
line-height: px2rem(60px);
padding-left: px2rem(15px);
height: 60px;
line-height: 60px;
padding-left: 15px;
&.active {
color: #449284;
background: #fff;
&.active::before {
position: absolute;
left: 0;
top: px2rem(20px);
top: 20px;
z-index: 1;
content: "";
height: px2rem(20px);
width: px2rem(3px);
border-radius: px2rem(2px);
height: 20px;
width: 3px;
border-radius: 2px;
background: #449284;
}
}
}
&.fixed {
position: fixed;
top: px2rem(74px);
top: 74px;
left: 0;
bottom: 0;
right: px2rem(130px);
right: 130px;
z-index: 1;
background: #f8f9fa;
&.top {
top: px2rem(114px);
top: 114px;
}
}
}
.right {
flex: 1;
padding: 0 px2rem(15px) px2rem(30px);
padding: 0 15px 30px;
.list-wrapper {
.list {
.title {
display: inline-block;
// height: px2rem(35px);
padding: px2rem(6px) 0 px2rem(10px);
line-height: px2rem(1.2);
margin-top: px2rem(14px);
font-size: px2rem(15px);
// height: 35px;
padding: 6px 0 10px;
line-height: 1.2;
margin-top: 14px;
font-size: 15px;
font-weight: 700;
}
.item {
......@@ -437,19 +435,19 @@ export default {
z-index: 1;
display: flex;
flex-direction: column;
// height: px2rem(55px);
padding: px2rem(12px) 0;
margin-bottom: px2rem(6px);
// height: 55px;
padding: 12px 0;
margin-bottom: 6px;
justify-content: center;
text-align: center;
border-radius: px2rem(4px);
border-radius: 4px;
background: #f8f9fa;
align-items: center;
span {
display: inline-block;
// height: px2rem(20px);
line-height: px2rem(20px);
padding: 0 px2rem(20px);
// height: 20px;
line-height: 20px;
padding: 0 20px;
}
&.has-bind {
color: #449284;
......@@ -459,11 +457,11 @@ export default {
top: 0;
right: 0;
z-index: 1;
height: px2rem(15px);
line-height: px2rem(15px);
padding: 0 px2rem(4px);
border-radius: 0px px2rem(4px) 0px px2rem(4px);
font-size: px2rem(11px);
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
font-size: 11px;
color: #fff;
background: #449284;
}
......@@ -475,12 +473,12 @@ export default {
top: 0;
right: 0;
z-index: 1;
height: px2rem(15px);
line-height: px2rem(15px);
padding: 0 px2rem(4px);
border-radius: 0px px2rem(4px) 0px px2rem(4px);
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
opacity: 0.4;
font-size: px2rem(11px);
font-size: 11px;
background: rgba(0, 0, 0, 1);
}
}
......@@ -494,15 +492,15 @@ export default {
justify-content: center;
align-content: center;
align-items: center;
margin-top: px2rem(30px);
// width: px2rem(50px);
// height: px2rem(50px);
margin-top: 30px;
// width: 50px;
// height: 50px;
img {
width: px2rem(100px);
height: px2rem(100px);
width: 100px;
height: 100px;
}
span {
font-size: px2rem(12px);
font-size: 12px;
color: #c7c8c9;
}
}
......@@ -518,11 +516,11 @@ export default {
.back-up-icon {
position: fixed;
z-index: 10;
bottom: px2rem(50px);
right: px2rem(15px);
bottom: 50px;
right: 15px;
img {
width: px2rem(35px);
height: px2rem(35px);
width: 35px;
height: 35px;
}
}
.fade-enter-active,
......
src/views/index.vue
浏览文件 @ 97d3ff26
......@@ -364,96 +364,94 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../style/mixin";
<style lang="less" scoped>
.page-content {
padding-top: px2rem(74px);
padding-top: 74px;
min-height: 100vh;
.body {
// min-height: 90vh;
display: flex;
flex-direction: row;
font-size: px2rem(14px);
font-size: 14px;
color: #676869;
&.body-pt {
padding-top: px2rem(40px);
padding-top: 40px;
}
.left {
width: px2rem(130px);
width: 130px;
background: #fff;
li {
position: relative;
display: block;
height: px2rem(60px);
line-height: px2rem(60px);
padding-left: px2rem(15px);
height: 60px;
line-height: 60px;
padding-left: 15px;
&.active {
color: #449284;
background: #fff;
&.active::before {
position: absolute;
left: 0;
top: px2rem(20px);
top: 20px;
z-index: 1;
content: "";
height: px2rem(20px);
width: px2rem(3px);
border-radius: px2rem(2px);
height: 20px;
width: 3px;
border-radius: 2px;
background: #449284;
}
}
}
&.fixed {
position: fixed;
top: px2rem(74px);
top: 74px;
left: 0;
bottom: 0;
right: px2rem(130px);
right: 130px;
z-index: 1;
background: #f8f9fa;
&.top {
top: px2rem(114px);
top: 114px;
}
}
}
.right {
flex: 1;
padding: 0 px2rem(15px) px2rem(30px);
padding: 0 15px 30px;
.list-wrapper {
.list {
.title {
display: inline-block;
// height: px2rem(35px);
padding: px2rem(6px) 0 px2rem(10px);
// line-height: px2rem(1.2);
margin-top: px2rem(14px);
font-size: px2rem(15px);
// height: 35px;
padding: 6px 0 10px;
// line-height: 1.2;
margin-top: 14px;
font-size: 15px;
font-weight: 700;
color: #373839;
}
.item {
li {
min-height: px2rem(60px);
min-height: 60px;
position: relative;
top: 0;
left: 0;
z-index: 1;
display: flex;
flex-direction: column;
// height: px2rem(55px);
padding: px2rem(12px) 0;
margin-bottom: px2rem(6px);
// height: 55px;
padding: 12px 0;
margin-bottom: 6px;
justify-content: center;
text-align: center;
border-radius: px2rem(4px);
border-radius: 4px;
background: #f8f9fa;
align-items: center;
span {
display: inline-block;
// height: px2rem(20px);
line-height: px2rem(20px);
padding: 0 px2rem(20px);
// height: 20px;
line-height: 20px;
padding: 0 20px;
}
&.has-bind {
color: #449284;
......@@ -463,11 +461,11 @@ export default {
top: 0;
right: 0;
z-index: 1;
height: px2rem(15px);
line-height: px2rem(15px);
padding: 0 px2rem(4px);
border-radius: 0px px2rem(4px) 0px px2rem(4px);
font-size: px2rem(11px);
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
font-size: 11px;
color: #fff;
background: #449284;
}
......@@ -479,12 +477,12 @@ export default {
top: 0;
right: 0;
z-index: 1;
height: px2rem(15px);
line-height: px2rem(15px);
padding: 0 px2rem(4px);
border-radius: 0px px2rem(4px) 0px px2rem(4px);
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
opacity: 0.4;
font-size: px2rem(11px);
font-size: 11px;
background: rgba(0, 0, 0, 1);
}
}
......@@ -498,15 +496,15 @@ export default {
justify-content: center;
align-content: center;
align-items: center;
margin-top: px2rem(60px);
// width: px2rem(50px);
// height: px2rem(50px);
margin-top: 60px;
// width: 50px;
// height: 50px;
img {
width: px2rem(100px);
height: px2rem(100px);
width: 100px;
height: 100px;
}
span {
font-size: px2rem(12px);
font-size: 12px;
color: #c7c8c9;
}
}
......@@ -522,11 +520,11 @@ export default {
.back-up-icon {
position: fixed;
z-index: 10;
bottom: px2rem(50px);
right: px2rem(15px);
bottom: 50px;
right: 15px;
img {
width: px2rem(35px);
height: px2rem(35px);
width: 35px;
height: 35px;
}
}
.fade-enter-active,
......
src/views/merge-detail copy.vue
浏览文件 @ 97d3ff26
......@@ -1076,82 +1076,81 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../style/mixin";
<style lang="less" scoped>
.page-container-merge {
.nav-top .nav-title {
height: px2rem(0px);
// padding: px2rem(18px);
height: 0px;
// padding: 18px;
}
.banner-img {
display: inherit;
width: px2rem(375px);
height: px2rem(210px);
width: 375px;
height: 210px;
&-1 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
top: 180px;
width: 76px;
height: 30px;
}
&-5 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
top: 180px;
width: 76px;
height: 30px;
}
&-10 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
top: 180px;
width: 76px;
height: 30px;
}
}
.list-container {
// margin-bottom: px2rem(40px);
// margin-bottom: 40px;
.sk-btn-cover-new {
position: absolute;
top: 0;
left: 0;
right: 0;
height: px2rem(210px);
height: 210px;
z-index: 100;
text-align: center;
// background: #fff;
font-size: px2rem(13px);
font-size: 13px;
// border-radius: 50%;
background: rgba(51, 51, 51, 0.8);
span {
display: inline-block;
margin-top: px2rem(82px);
width: px2rem(100px);
height: px2rem(36px);
line-height: px2rem(36px);
font-size: px2rem(15px);
margin-top: 82px;
width: 100px;
height: 36px;
line-height: 36px;
font-size: 15px;
font-weight: 700;
border-radius: px2rem(20px);
border-radius: 20px;
color: #fff;
background: #449284;
&.android {
padding-top: px2rem(2px);
padding-top: 2px;
}
}
}
}
.intro-catalogue-container {
.title {
height: px2rem(50px);
line-height: px2rem(30px);
padding: 0 px2rem(15px);
height: 50px;
line-height: 30px;
padding: 0 15px;
border-bottom: 1px solid #f0f1f2;
span {
display: inline-block;
line-height: px2rem(15px);
font-size: px2rem(15px);
line-height: 15px;
font-size: 15px;
color: #979899;
padding-right: px2rem(35px);
padding-right: 35px;
}
span.focus {
position: relative;
......@@ -1160,19 +1159,19 @@ export default {
span.focus:after {
content: "";
position: absolute;
left: px2rem(9px);
bottom: px2rem(-14px);
left: 9px;
bottom: -14px;
background: #449284;
// border-bottom: px2rem(1px) solid #449284;
width: px2rem(10px);
height: px2rem(3px);
border-radius: px2rem(3px);
// border-bottom: 1px solid #449284;
width: 10px;
height: 3px;
border-radius: 3px;
}
}
.title.fixed-title-1 {
position: fixed;
left: 0;
top: px2rem(60px);
top: 60px;
background: #fff;
width: 100%;
z-index: 999;
......@@ -1180,40 +1179,40 @@ export default {
.title.fixed-title-2 {
position: fixed;
left: 0;
top: px2rem(0px);
top: 0px;
background: #fff;
width: 100%;
z-index: 999;
}
.catalogue-content {
padding: 0 px2rem(15px);
padding: 0 15px;
.catalogue-title {
// display: flex;
// flex-direction: row;
// align-items: center;
// align-content: center;
margin-top: px2rem(5px);
// margin-bottom: px2rem(16px);
margin-top: 5px;
// margin-bottom: 16px;
.c-title {
font-size: px2rem(18px);
font-size: 18px;
color: #373839;
font-weight: 700;
}
.c-sub {
margin-left: px2rem(-6px);
font-size: px2rem(12px);
margin-left: -6px;
font-size: 12px;
color: #979899;
}
}
}
.fixed-flag-height {
height: px2rem(50px);
height: 50px;
}
}
}
.no-more-bottom {
position: relative;
width: 100%;
height: px2rem(40px);
height: 40px;
}
</style>
src/views/merge-detail.vue
浏览文件 @ 97d3ff26
......@@ -1080,82 +1080,81 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../style/mixin";
<style lang="less" scoped>
.page-container-merge {
.nav-top .nav-title {
height: px2rem(0px);
// padding: px2rem(18px);
height: 0px;
// padding: 18px;
}
.banner-img {
display: inherit;
width: px2rem(375px);
height: px2rem(210px);
width: 375px;
height: 210px;
&-1 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
top: 180px;
width: 76px;
height: 30px;
}
&-5 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
top: 180px;
width: 76px;
height: 30px;
}
&-10 {
position: absolute;
left: 0;
top: px2rem(180px);
width: px2rem(76px);
height: px2rem(30px);
top: 180px;
width: 76px;
height: 30px;
}
}
.list-container {
// margin-bottom: px2rem(40px);
// margin-bottom: 40px;
.sk-btn-cover-new {
position: absolute;
top: 0;
left: 0;
right: 0;
height: px2rem(210px);
height: 210px;
z-index: 100;
text-align: center;
// background: #fff;
font-size: px2rem(13px);
font-size: 13px;
// border-radius: 50%;
background: rgba(51, 51, 51, 0.8);
span {
display: inline-block;
margin-top: px2rem(82px);
width: px2rem(100px);
height: px2rem(36px);
line-height: px2rem(36px);
font-size: px2rem(15px);
margin-top: 82px;
width: 100px;
height: 36px;
line-height: 36px;
font-size: 15px;
font-weight: 700;
border-radius: px2rem(20px);
border-radius: 20px;
color: #fff;
background: #449284;
&.android {
padding-top: px2rem(2px);
padding-top: 2px;
}
}
}
}
.intro-catalogue-container {
.title {
height: px2rem(50px);
line-height: px2rem(30px);
padding: 0 px2rem(15px);
height: 50px;
line-height: 30px;
padding: 0 15px;
border-bottom: 1px solid #f0f1f2;
span {
display: inline-block;
line-height: px2rem(15px);
font-size: px2rem(15px);
line-height: 15px;
font-size: 15px;
color: #979899;
padding-right: px2rem(35px);
padding-right: 35px;
}
span.focus {
position: relative;
......@@ -1164,19 +1163,19 @@ export default {
span.focus:after {
content: "";
position: absolute;
left: px2rem(9px);
bottom: px2rem(-14px);
left: 9px;
bottom: -14px;
background: #449284;
// border-bottom: px2rem(1px) solid #449284;
width: px2rem(10px);
height: px2rem(3px);
border-radius: px2rem(3px);
// border-bottom: 1px solid #449284;
width: 10px;
height: 3px;
border-radius: 3px;
}
}
.title.fixed-title-1 {
position: fixed;
left: 0;
top: px2rem(60px);
top: 60px;
background: #fff;
width: 100%;
z-index: 999;
......@@ -1184,40 +1183,40 @@ export default {
.title.fixed-title-2 {
position: fixed;
left: 0;
top: px2rem(0px);
top: 0px;
background: #fff;
width: 100%;
z-index: 999;
}
.catalogue-content {
padding: 0 px2rem(15px);
padding: 0 15px;
.catalogue-title {
// display: flex;
// flex-direction: row;
// align-items: center;
// align-content: center;
margin-top: px2rem(5px);
// margin-bottom: px2rem(16px);
margin-top: 5px;
// margin-bottom: 16px;
.c-title {
font-size: px2rem(18px);
font-size: 18px;
color: #373839;
font-weight: 700;
}
.c-sub {
margin-left: px2rem(-6px);
font-size: px2rem(12px);
margin-left: -6px;
font-size: 12px;
color: #979899;
}
}
}
.fixed-flag-height {
height: px2rem(50px);
height: 50px;
}
}
}
.no-more-bottom {
position: relative;
width: 100%;
height: px2rem(40px);
height: 40px;
}
</style>
src/views/test-components.vue
浏览文件 @ 97d3ff26
......@@ -68,8 +68,7 @@ export default {
}
};
</script>
<style lang="scss" scoped>
@import "../style/mixin";
<style lang="less" scoped>
.test-container {
// background: rgba($color: #000000, $alpha: 0.8);
}
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或