Skip to content

P
pica-annual-summary
提交 6753de57 编写于 作者: 张平's avatar 张平
浏览文件
操作

Merge branch 'dev-optimize-1124' into 'release' 

职称考首页优化  code reviewer：张平

职称考首页优化  code reviewer：张平

See merge request !6
上级 68af0ac1 b91f9a6c
显示空白字符变更
内嵌 并排
正在显示 包含 944 行增加 和 297 行删除
package-lock.json
浏览文件 @ 6753de57
......@@ -2408,13 +2408,15 @@
"version": "0.3.2",
"resolved": "http://192.168.110.93:4873/array-unique/-/array-unique-0.3.2.tgz",
"integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=",
"dev": true
"dev": true,
"optional": true
},
"braces": {
"version": "2.3.2",
"resolved": "http://192.168.110.93:4873/braces/-/braces-2.3.2.tgz",
"integrity": "sha512-aNdbnj9P8PjdXU4ybaWLK2IF3jc/EoDYbC7AazW6to3TRsfXxscC9UXOB5iDiEQrkyIbWp2SLQda4+QAa7nc3w==",
"dev": true,
"optional": true,
"requires": {
"arr-flatten": "^1.1.0",
"array-unique": "^0.3.2",
......@@ -2433,6 +2435,7 @@
"resolved": "http://192.168.110.93:4873/extend-shallow/-/extend-shallow-2.0.1.tgz",
"integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
"dev": true,
"optional": true,
"requires": {
"is-extendable": "^0.1.0"
}
......@@ -2615,6 +2618,7 @@
"resolved": "http://192.168.110.93:4873/fill-range/-/fill-range-4.0.0.tgz",
"integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc=",
"dev": true,
"optional": true,
"requires": {
"extend-shallow": "^2.0.1",
"is-number": "^3.0.0",
......@@ -2627,6 +2631,7 @@
"resolved": "http://192.168.110.93:4873/extend-shallow/-/extend-shallow-2.0.1.tgz",
"integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
"dev": true,
"optional": true,
"requires": {
"is-extendable": "^0.1.0"
}
......@@ -3251,6 +3256,7 @@
"resolved": "http://192.168.110.93:4873/is-number/-/is-number-3.0.0.tgz",
"integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
"dev": true,
"optional": true,
"requires": {
"kind-of": "^3.0.2"
},
......@@ -3260,6 +3266,7 @@
"resolved": "http://192.168.110.93:4873/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
"dev": true,
"optional": true,
"requires": {
"is-buffer": "^1.1.5"
}
......@@ -3270,13 +3277,15 @@
"version": "3.0.1",
"resolved": "http://192.168.110.93:4873/isobject/-/isobject-3.0.1.tgz",
"integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=",
"dev": true
"dev": true,
"optional": true
},
"kind-of": {
"version": "6.0.2",
"resolved": "http://192.168.110.93:4873/kind-of/-/kind-of-6.0.2.tgz",
"integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==",
"dev": true
"dev": true,
"optional": true
},
"micromatch": {
"version": "3.1.10",
......@@ -3526,6 +3535,7 @@
"resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
"integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
"dev": true,
"optional": true,
"requires": {
"hoek": "2.x.x"
}
......@@ -4987,7 +4997,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"aproba": {
"version": "1.2.0",
......@@ -5402,7 +5413,8 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"safer-buffer": {
"version": "2.1.2",
......@@ -5458,6 +5470,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
......@@ -5501,12 +5514,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
}
}
},
......@@ -5848,7 +5863,8 @@
"version": "2.16.3",
"resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
"integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
"dev": true
"dev": true,
"optional": true
},
"html-comment-regex": {
"version": "1.1.2",
......
src/components/course/common-img-title.vue 0 → 100644
浏览文件 @ 6753de57
<template>
<div class="common-img-title">
<img v-show="imgType == 1" src="../../images/course/icon-title-gj.png" alt="">
<img v-show="imgType == 2" src="../../images/course/icon-title-zj.png" alt="">
<span >{{title}}</span>
</div>
</template>
<script>
export default {
props: {
title: {
type: String,
default: "高级职称"
},
imgType: {
type: String | Number,
default: 1,
}
},
}
</script>
<style lang="less" scoped>
.common-img-title {
display: flex;
flex-direction: row;
align-items: center;
height: 48px;
border-bottom: 1px solid #F0F1F2;
margin-bottom: 10px;
// padding: 0 15px;
& > img {
width: 20px;
height: 20px;
}
& > span {
margin-left: 4px;
font-size: 16px;
font-weight: 700;
color: #373839;
}
}
</style>
src/main.js
浏览文件 @ 6753de57
......@@ -7,7 +7,6 @@ const mixins = require('@/utils/mixins');
import '@/utils/rem' // 引入自适应
import '@/utils/yqy-bridge' // 移动端服务
import '@/utils/wxShare';
// import FastClick from 'fastclick'
import vueFilters from '@/utils/filter';
import BuriedPoint, { sendBuriedData } from 'web-buried-point';
import Vant from 'vant';
......@@ -17,27 +16,21 @@ import { querystring } from '@/utils';
//注册到vue原型上
Vue.prototype.clipboard = clipboard;
// if (!(process.env.BUILD_ENV === 'uat' || process.env.BUILD_ENV === 'pro')) {
if (!(process.env.BUILD_ENV === 'pro')) {
const envList = ['dev', 'test', 'uat'];
const { BUILD_ENV } = process.env;
if (envList.indexOf(BUILD_ENV) != -1) {
const VConsole = require('vconsole');
let vConsole = new VConsole() // 初始化
new VConsole();
}
// 可调试
// Vue.config.devtools = true;
// 注册所有公用过滤器
for (let key in vueFilters) {
Vue.filter(key, vueFilters[key])
}
// if ('addEventListener' in document) {
// document.addEventListener('DOMContentLoaded', function() {
// FastClick.attach(document.body);
// }, false);
// }
// Vue.use(DiscussTopicStencil)
Vue.use(VueRouter)
const router = new VueRouter({
routes,
......
src/router/router.js
浏览文件 @ 6753de57
import App from '../App'
const index = r => require.ensure([], () => r(require('../views/index')), 'index')
const indexOld = r => require.ensure([], () => r(require('../views/index-old')), 'index-old')
const merge = r => require.ensure([], () => r(require('../views/merge-detail')), 'merge')
const shareMerge = r => require.ensure([], () => r(require('../views/share-merge-detail')), 'share-merge')
const test = r => require.ensure([], () => r(require('../views/test-components')), 'test-components')
......@@ -26,6 +27,10 @@ export default [{
path: '/index',
component: index
},
{
path: '/index-old',
component: indexOld
},
{
path: '/home',
component: index
......
src/utils/env-config.js
浏览文件 @ 6753de57
......@@ -8,29 +8,30 @@ export const envConfig = {
// baseUrl: 'http://10.177.15.180:10202/',
// baseUrl: 'http://192.168.140.14:10201/',
apiUrl: 'https://test1-api.yunqueyi.com/',
// baseUrl: 'https://dev-sc.yunqueyi.com/',
// apiUrl: 'https://dev-api.yunqueyi.com/',
// webPageUrl: 'https://dev-phome.yunqueyi.com/',
// hactiveUrl: 'https://dev-hactive.yunqueyi.com',
// fileUrl: 'https://dev-www.yunqueyi.com',
// appId: 'wx2c577552a2d28550', // 用于微信授权登录
// wxType: 15, // 分享、用户信息对应的appid
// tradeType: 4,
baseUrl: 'https://test1-sc.yunqueyi.com/',
apiUrl: 'https://test1-api.yunqueyi.com/',
webPageUrl: 'https://test1-phome.yunqueyi.com/',
hactiveUrl: 'https://test1-hactive.yunqueyi.com',
fileUrl: 'https://test1-www.yunqueyi.com',
appId: 'wx08b383d002c73f26', // 用于微信授权登录
// appId: 'wxcaad75b7fff5659c', // 用于微信授权登录
appId: 'wx2c577552a2d28550', // 用于微信授权登录
wxType: 15, // 分享、用户信息对应的appid
tradeType: 4,
// appId: 'wxf4e66242d31c81c2', // 用于微信授权登录
// baseUrl: 'https://test1-sc.yunqueyi.com/',
// apiUrl: 'https://test1-api.yunqueyi.com/',
// webPageUrl: 'https://test1-phome.yunqueyi.com/',
// hactiveUrl: 'https://dev-hactive.yunqueyi.com',
// fileUrl: 'https://test1-www.yunqueyi.com',
// appId: 'wxcaad75b7fff5659c', // 用于微信授权登录
// baseUrl: 'https://uat-sc.yunqueyi.com/',
// apiUrl: 'https://uat-api.yunqueyi.com/',
// webPageUrl: 'https://uat-phome.yunqueyi.com/',
// hactiveUrl: 'https://uat-hactive.yunqueyi.com',
// fileUrl: 'https://dev-www.yunqueyi.com',
// fileUrl: 'https://test1-www.yunqueyi.com',
// appId: 'wxf4e66242d31c81c2', // 用于微信授权登录
// apiUrl: 'https://uat-api.yunqueyi.com/',
......
src/views/index-old.vue 0 → 100644
浏览文件 @ 6753de57
<template>
<!-- 专业选择列表 -->
<div class="page-container">
<CommonNavbar
:bgColor="bgColor"
v-show="isShowNavbar"
:title="navTitle"
:isFixNavbar="isFixNavbar"
:burialPoint="pointStyle"
borderStyle="1px solid #fff"
></CommonNavbar>
<section class="page-content">
<section v-show="!existBind" class="cb-wrapper padding-top-111">
<CardBanner :hasLogin="hasLogin"></CardBanner>
</section>
<section class="body" :class="{'body-pt': !existBind}">
<ul class="left fixed" :class="{'top': !existBind}">
<li
v-for="(model, mIndex) in titleTestModelList"
:key="mIndex"
:class="{active: currentModelIndex == mIndex}"
@click="selectModel(model, mIndex)"
>
<span>{{model.title}}</span>
</li>
</ul>
<ul class="left"></ul>
<article class="right">
<ul class="list-wrapper">
<li class="list" v-for="(item, index) in listData" :key="index">
<span class="title">{{item.name}}</span>
<ul class="item">
<li
:id="'subject_' + index + '_' + sIndex"
class="card"
:class="{'no-active' : subject.openFlag == 0, 'has-bind' : subject.bindCardStatus == 1}"
v-for="(subject, sIndex) in item.secondSubjectModelList"
:key="sIndex"
@click="coopDetails(subject)"
>
<span>{{subject.name}}</span>
<span v-show="subject.code">({{subject.code}})</span>
<span v-show="subject.bindCardStatus == 1" class="buy">己购</span>
<span
v-show="subject.openFlag == 0"
class="time"
>{{formatTime2(subject.predictTime)}}上线</span>
</li>
</ul>
</li>
<li class="no-list" v-show="!listData.length">
<img src="../images/subject/no-subject.png" alt />
<span>正在更新中，敬请期待</span>
</li>
</ul>
</article>
</section>
</section>
<transition name="fade">
<article v-show="needShowBackup" @click="scrollTop" class="back-up-icon">
<img src="../images/cme/phrase2/back-top.png" alt />
</article>
</transition>
<Loading v-if="showLoading" />
</div>
</template>
<script>
import CommonNavbar from "@/components/common/common-navbar";
import CardBanner from "@/components/cme/card-banner";
import Loading from "@/components/common/common-loading";
import CommonTitle from "@/components/common/common-title";
import { mapGetters, mapActions } from "vuex";
import { getWebPageUrl, parseTime } from "@/utils/index";
import { Toast } from "vant";
export default {
data() {
return {
existBind: 0,
currentModelIndex: 2,
titleTestModelList: [],
showLoading: false,
isWeb: window.__isWeb,
isAndroid: window.__isAndroid,
isIOS: window.__isIOS,
bgColor: "#fff",
isShow: false,
navTitle: "选择专业",
isShowNavbar: true,
isFixNavbar: true,
pointStyle: "activity",
tabIndex: 1,
joinProjectList: [], // 我的项目
otherProjectList: [], // 全部项目
token: "",
userMobile: "",
needShowBackup: false,
listData: [
{
name: "中医",
list: [
{ name: "全科中医", code: 201, bindStatus: 0 },
{ name: "中医内科学中医内科学", code: 201, bindStatus: 0 },
{ name: "全科中医", code: 201, bindStatus: 0 }
]
},
{
name: "妇科",
list: [
{ name: "妇产科学", code: 201, bindStatus: 0 },
{ name: "中医内科学中医内科学", code: 201, bindStatus: 0 },
{ name: "全科中医", code: 201, bindStatus: 0 }
]
},
{
name: "内科",
list: [
{ name: "肾内科学", code: 201, bindStatus: 0 },
{
name: "肾内科学肾内科学肾内科学肾内科学",
code: 201,
bindStatus: 0
},
{ name: "全科中医", code: 201, bindStatus: 0 }
]
}
],
isInfresh: false,
hasLogin: false,
hasResetPosition: false
};
},
computed: {
...mapGetters(["userInfo"])
},
components: {
CardBanner,
CommonNavbar,
Loading,
CommonTitle
},
created() {
var _this = this;
_this.currentModelIndex = 2;
window.__getUserInfo = function(param) {
_this.setUserInfo(param);
_this.token = param.userToken;
_this.checkToken();
_this.userMobile = param.userMobile;
_this.getListData();
console.log("__getUserInfo", param);
};
_this.getUserInfo();
if (__isWeb) {
_this.getListData();
}
window.__refresh = function() {
_this.isInfresh = true;
// _this.currentModelIndex = 0;
console.log(_this.currentModelIndex);
_this.getUserInfo();
};
// 打开页面埋点
// this.$sendBuriedData({
// component_tag: "210#0#0#0"
// });
window.addEventListener("scroll", this.scrollFun);
},
mounted() {
this.listData = [];
// this.currentModelIndex = 0;
},
methods: {
...mapActions(["setUserInfo"]),
// 选择职称
selectModel(model, index) {
this.currentModelIndex = index;
this.listData =
this.titleTestModelList[index].firstSubjectModelList || [];
this.$sendBuriedData({
component_tag: model.titleCode === '1001' ? '886#8861' : (model.titleCode === '1002' ? '886#8862' : '886#8863')
});
},
// 跳转到项目页面
coopDetails(item) {
if (item.openFlag == 0) return;
this.$sendBuriedData({
component_tag: `886#8864#${item.id}#${item.name}` //'210#210002#0#'+item.projectName
});
// 临时添加
if (window.__isWeb) {
this.$router.push({
path: "/coop",
query: {
id: item.projectId
}
});
return;
}
let appVersion = this.userInfo.appVersion;
let appVersionNum = appVersion.split(".").join("");
console.log("appVersionNum", appVersionNum);
if (appVersionNum < 341) {
Toast("请您下载新版本App");
return;
}
let paramList = [
{
key: "pageUrl",
value: getWebPageUrl(`profexam/#/coop?id=${item.projectId}`),
type: 4,
seqNo: 1
}
];
rocNative.dispatchEventByModuleCode({
modeCode: "M300",
jsonString: paramList
});
},
//获取版本号
getUserInfo() {
rocNative.getUserInfo({
__funcName: "__getUserInfo"
});
},
// 查询列表
getListData() {
let _this = this;
let param = {
token: _this.token,
setEntry: true
};
this.showLoading = true;
this.GET(`portal/titleTestApp/list`, param).then(res => {
this.showLoading = false;
if (res.code == "000000") {
this.existBind = res.data.existBind || 0;
this.titleTestModelList = res.data.titleTestModelList || [];
let len = this.titleTestModelList.length > 0 ? (this.titleTestModelList.length - 1) : 0;
// 如果有绑定的卡，并且之前没有做定位，则进行定位
if (this.existBind && !this.hasResetPosition) {
this.hasResetPosition = true;
this.resetPosition(this.titleTestModelList);
// 否则直接使用当前的位置信息
} else {
this.listData =
res.data.titleTestModelList[
len
].firstSubjectModelList;
this.currentModelIndex = len;
}
} else {
this.$toast(res.message);
}
});
},
// 查找对应的职称与专业
resetPosition(list) {
if (!list.length) return;
let parentIndex = 0,
fIndex = 0,
subIndex = 0,
firstSub = [],
secondSub = [];
outloop: for (let i = 0; i < list.length; i++) {
firstSub = list[i].firstSubjectModelList;
for (let j = 0; j < firstSub.length; j++) {
secondSub = firstSub[j].secondSubjectModelList;
for (let k = 0; k < secondSub.length; k++) {
if (secondSub[k].bindCardStatus) {
parentIndex = i;
fIndex = j;
subIndex = k;
break outloop;
}
}
}
}
this.currentModelIndex = parentIndex;
this.listData =
this.titleTestModelList[parentIndex].firstSubjectModelList || [];
this.$forceUpdate();
this.resetProjectPosition(fIndex, subIndex);
},
// 将定位到的元素，滚动到最上面
resetProjectPosition(fIndex, subIndex) {
this.$nextTick(() => {
setTimeout(() => {
let scrollTop = document.getElementById(
`subject_${fIndex}_${subIndex}`
).offsetTop;
window.scrollTo(0, scrollTop - 120);
}, 100);
});
},
// 监听滚动事件
scrollFun() {
let scrollTop = window.scrollY;
if (scrollTop >= 500) {
this.needShowBackup = true;
} else {
this.needShowBackup = false;
}
},
// 滚动到顶部
scrollTop() {
window.scrollTo(0, 0);
},
// 格式化时间
formatTime(time, cFormat) {
return parseTime(time, cFormat);
},
formatTime2(time) {
if(!time) return '';
let year = time.substr(0, 4);
let month = time.substr(5, 2);
// if(month < 10) {
// month = time.substr(6, 1);
// }
return `${year}年${month}月`;
},
// token是否失效校验
checkToken() {
let _this = this;
let param = {
token: _this.userInfo.userToken || _this.token,
setEntry: true
};
this.GET("campaign/admin/task/checkToken", param).then(res => {
if (res.code !== "000000") {
//未登录 跳转登录页
console.log("跳登录", _this.isInfresh);
if (_this.isInfresh) {
rocNative.goBack();
} else {
rocNative.gotoLogin();
}
_this.isInfresh = false;
} else {
_this.hasLogin = true;
}
});
}
}
};
</script>
<style lang="less" scoped>
.page-content {
padding-top: 74px;
min-height: 100vh;
.body {
// min-height: 90vh;
display: flex;
flex-direction: row;
font-size: 14px;
color: #676869;
&.body-pt {
padding-top: 40px;
}
.left {
width: 130px;
background: #fff;
li {
position: relative;
display: block;
height: 60px;
line-height: 60px;
padding-left: 15px;
&.active {
color: #449284;
background: #fff;
&.active::before {
position: absolute;
left: 0;
top: 20px;
z-index: 1;
content: "";
height: 20px;
width: 3px;
border-radius: 2px;
background: #449284;
}
}
}
&.fixed {
position: fixed;
top: 74px;
left: 0;
bottom: 0;
right: 130px;
z-index: 1;
background: #f8f9fa;
&.top {
top: 114px;
}
}
}
.right {
flex: 1;
padding: 0 15px 30px;
.list-wrapper {
.list {
.title {
display: inline-block;
// 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: 60px;
position: relative;
top: 0;
left: 0;
z-index: 1;
display: flex;
flex-direction: column;
// height: 55px;
padding: 12px 0;
margin-bottom: 6px;
justify-content: center;
text-align: center;
border-radius: 4px;
background: #f8f9fa;
align-items: center;
span {
display: inline-block;
// height: 20px;
line-height: 20px;
padding: 0 20px;
}
&.has-bind {
color: #449284;
background: rgba(68, 146, 132, 0.1);
.buy {
position: absolute;
top: 0;
right: 0;
z-index: 1;
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
font-size: 11px;
color: #fff;
background: #449284;
}
}
&.no-active {
color: #c7c8c9;
.time {
position: absolute;
top: 0;
right: 0;
z-index: 1;
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
opacity: 0.4;
font-size: 11px;
background: rgba(0, 0, 0, 1);
}
}
}
}
}
.no-list {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
align-items: center;
margin-top: 60px;
// width: 50px;
// height: 50px;
img {
width: 100px;
height: 100px;
}
span {
font-size: 12px;
color: #c7c8c9;
}
}
}
}
}
.cb-wrapper {
position: fixed;
z-index: 2;
width: 100%;
}
}
.back-up-icon {
position: fixed;
z-index: 10;
bottom: 50px;
right: 15px;
img {
width: 35px;
height: 35px;
}
}
.fade-enter-active,
.fade-leave-active {
transition: opacity 0.5s;
}
.fade-enter,
.fade-leave-active {
opacity: 0;
}
</style>
src/views/index.vue
浏览文件 @ 6753de57
......@@ -10,52 +10,76 @@
borderStyle="1px solid #fff"
></CommonNavbar>
<section class="page-content">
<section v-show="!existBind" class="cb-wrapper padding-top-111">
<CardBanner :hasLogin="hasLogin"></CardBanner>
</section>
<section class="body" :class="{'body-pt': !existBind}">
<ul class="left fixed" :class="{'top': !existBind}">
<li
v-for="(model, mIndex) in titleTestModelList"
:key="mIndex"
:class="{active: currentModelIndex == mIndex}"
@click="selectModel(model, mIndex)"
>
<span>{{model.title}}</span>
<table class="page-content-table">
<tr>
<td @click="changeTab(1)" :class="{'active': tabIndex === 1}">
<div class="tap-title">
<span :style="{'color': tabIndex === 1 ? '#333' : '#999'}">高级职称</span>
<span :class="{'android': isAndroid, 'ios': isIOS}"></span>
</div>
</td>
<td @click="changeTab(2)" :class="{'active': tabIndex === 2}">
<div class="tap-title">
<span :style="{'color': tabIndex === 2 ? '#333' : '#999'}">中级职称</span>
<span :class="{'android': isAndroid, 'ios': isIOS}"></span>
</div>
</td>
</tr>
</table>
<article class="page-content-list" style="margin-top: 55px;">
<CommonImgTitle></CommonImgTitle>
<div :id="'subject_1_' + index" class="subject" v-for="(item, index) in gjFirstSubjectModelList" :key="index">
<p>{{item.name}}<span v-show="item.code">（{{item.code}}）</span></p>
<ul class="item-wrapper">
<li @click="coopDetails(item, 1)" v-if="item.openFlag" class="item">
<img src="../images/course/icon-kc-1.png" alt="">
<span>课程</span>
<img v-if="item.bindCardStatus" class="buy" src="../images/course/icon-buy.png" alt="">
</li>
</ul>
<ul class="left"></ul>
<article class="right">
<ul class="list-wrapper">
<li class="list" v-for="(item, index) in listData" :key="index">
<span class="title">{{item.name}}</span>
<ul class="item">
<li
:id="'subject_' + index + '_' + sIndex"
class="card"
:class="{'no-active' : subject.openFlag == 0, 'has-bind' : subject.bindCardStatus == 1}"
v-for="(subject, sIndex) in item.secondSubjectModelList"
:key="sIndex"
@click="coopDetails(subject)"
>
<span>{{subject.name}}</span>
<span v-show="subject.code">({{subject.code}})</span>
<span v-show="subject.bindCardStatus == 1" class="buy">己购</span>
<span
v-show="subject.openFlag == 0"
class="time"
>{{formatTime2(subject.predictTime)}}上线</span>
<!-- {{formatTime(subject.predictTime, '{y}年{m}月')}}上线 -->
<li v-if="!item.openFlag && item.resourceModelList.length" class="item-pre">
<div class="pre">
<img src="../images/course/icon-kc-2.png" alt="">
<span class="pre">课程</span>
</div>
<p v-show="item.predictTime">{{formatTime2(item.predictTime)}}上线</p>
</li>
<li @click="coopDetails(item, 2)" v-if="item.directoryList.length" class="item tk">
<img src="../images/course/icon-tk-1.png" alt="">
<span>题库</span>
<img v-if="item.bindDirectoryCardStatus" class="buy" src="../images/course/icon-buy.png" alt="">
</li>
</ul>
</div>
</article>
<article ref="zjListRef" id="zjListRef" class="page-content-list">
<CommonImgTitle imgType=2 title="中级职称"></CommonImgTitle>
<div :id="'subject_0_' + index" class="subject" v-for="(item, index) in zjFirstSubjectModelList" :key="index">
<p>{{item.name}}<span v-show="item.code">（{{item.code}}）</span></p>
<ul class="item-wrapper">
<li @click="coopDetails(item, 1)" v-if="item.openFlag" class="item">
<img src="../images/course/icon-kc-1.png" alt="">
<span>课程</span>
<img v-if="item.bindCardStatus" class="buy" src="../images/course/icon-buy.png" alt="">
</li>
<li class="no-list" v-show="!listData.length">
<img src="../images/subject/no-subject.png" alt />
<span>正在更新中，敬请期待</span>
<li v-if="!item.openFlag && item.resourceModelList.length" class="item-pre">
<div class="pre">
<img src="../images/course/icon-kc-2.png" alt="">
<span class="pre">课程</span>
</div>
<p v-show="item.predictTime">{{formatTime2(item.predictTime)}}上线</p>
</li>
<li @click="coopDetails(item, 2)" v-if="item.directoryList.length" class="item tk">
<img src="../images/course/icon-tk-1.png" alt="">
<span>题库</span>
<img v-if="item.bindDirectoryCardStatus" class="buy" src="../images/course/icon-buy.png" alt="">
</li>
</ul>
</div>
</article>
</section>
<!-- 修复一个神奇的bug：底部与背景色重叠 -->
<div style="height: 10px;background: #F8F9FA;"></div>
</section>
<transition name="fade">
......@@ -68,19 +92,17 @@
</template>
<script>
import CommonNavbar from "@/components/common/common-navbar";
import CardBanner from "@/components/cme/card-banner";
import Loading from "@/components/common/common-loading";
import CommonTitle from "@/components/common/common-title";
import CommonImgTitle from "@/components/course/common-img-title";
import { mapGetters, mapActions } from "vuex";
import { getWebPageUrl, parseTime } from "@/utils/index";
import { Toast } from "vant";
let zjListOffsetTop = 0;
let screenHeight = 667;
export default {
data() {
return {
existBind: 0,
currentModelIndex: 2,
titleTestModelList: [],
showLoading: false,
isWeb: window.__isWeb,
isAndroid: window.__isAndroid,
......@@ -97,36 +119,9 @@ export default {
token: "",
userMobile: "",
needShowBackup: false,
listData: [
{
name: "中医",
list: [
{ name: "全科中医", code: 201, bindStatus: 0 },
{ name: "中医内科学中医内科学", code: 201, bindStatus: 0 },
{ name: "全科中医", code: 201, bindStatus: 0 }
]
},
{
name: "妇科",
list: [
{ name: "妇产科学", code: 201, bindStatus: 0 },
{ name: "中医内科学中医内科学", code: 201, bindStatus: 0 },
{ name: "全科中医", code: 201, bindStatus: 0 }
]
},
{
name: "内科",
list: [
{ name: "肾内科学", code: 201, bindStatus: 0 },
{
name: "肾内科学肾内科学肾内科学肾内科学",
code: 201,
bindStatus: 0
},
{ name: "全科中医", code: 201, bindStatus: 0 }
]
}
],
listData: [],
zjFirstSubjectModelList: [],
gjFirstSubjectModelList: [],
isInfresh: false,
hasLogin: false,
hasResetPosition: false
......@@ -137,21 +132,19 @@ export default {
},
components: {
CardBanner,
CommonNavbar,
Loading,
CommonTitle
CommonImgTitle
},
created() {
var _this = this;
_this.currentModelIndex = 2;
window.__getUserInfo = function(param) {
_this.setUserInfo(param);
_this.token = param.userToken;
_this.checkToken();
_this.userMobile = param.userMobile;
_this.getListData();
console.log("__getUserInfo", param);
};
_this.getUserInfo();
if (__isWeb) {
......@@ -159,52 +152,53 @@ export default {
}
window.__refresh = function() {
_this.isInfresh = true;
// _this.currentModelIndex = 0;
console.log(_this.currentModelIndex);
_this.getUserInfo();
};
// 打开页面埋点
// this.$sendBuriedData({
// component_tag: "210#0#0#0"
// });
window.addEventListener("scroll", this.scrollFun);
},
mounted() {
this.listData = [];
// this.currentModelIndex = 0;
},
methods: {
...mapActions(["setUserInfo"]),
// 选择职称
selectModel(model, index) {
this.currentModelIndex = index;
this.listData =
this.titleTestModelList[index].firstSubjectModelList || [];
this.$sendBuriedData({
component_tag: model.titleCode === '1001' ? '886#8861' : (model.titleCode === '1002' ? '886#8862' : '886#8863')
});
// 切换列表, 滚动到列表指定位置
changeTab(index) {
if(index == 1) {
window.scrollTo(0, 0);
} else {
window.scrollTo(0, zjListOffsetTop - 30);
}
this.tabIndex = index;
},
// 跳转到项目页面
coopDetails(item) {
if (item.openFlag == 0) return;
// 跳转到项目页面或课程
coopDetails(item, type) {
// if (item.openFlag == 0) return;
this.$sendBuriedData({
component_tag: `886#8864#${item.id}#${item.name}` //'210#210002#0#'+item.projectName
});
// 临时添加
if (window.__isWeb) {
if(type == 1) {
this.$router.push({
path: "/coop",
query: {
id: item.projectId
}
});
} else {
this.$router.push({
path: "/question-bank",
query: {
secondSubjectId: item.id
}
});
}
return;
}
......@@ -216,10 +210,14 @@ export default {
return;
}
let pageUrl = getWebPageUrl(`profexam/#/coop?id=${item.projectId}`);
if(type == 2) {
pageUrl = getWebPageUrl(`profexam/#/question-bank?secondSubjectId=${item.id}`)
}
let paramList = [
{
key: "pageUrl",
value: getWebPageUrl(`profexam/#/coop?id=${item.projectId}`),
value: pageUrl,
type: 4,
seqNo: 1
}
......@@ -241,7 +239,7 @@ export default {
getListData() {
let _this = this;
let param = {
token: _this.token,
token: _this.token || '531EB4560CBB4653B1F2C65B7F1816EF',
setEntry: true
};
this.showLoading = true;
......@@ -249,20 +247,26 @@ export default {
this.showLoading = false;
if (res.code == "000000") {
this.existBind = res.data.existBind || 0;
this.titleTestModelList = res.data.titleTestModelList || [];
let len = this.titleTestModelList.length > 0 ? (this.titleTestModelList.length - 1) : 0;
this.zjFirstSubjectModelList = res.data.titleTestModelList[0].firstSubjectModelList[0] && res.data.titleTestModelList[0].firstSubjectModelList[0].secondSubjectModelList || [];
this.gjFirstSubjectModelList = res.data.titleTestModelList[2].firstSubjectModelList[0] && res.data.titleTestModelList[2].firstSubjectModelList[0].secondSubjectModelList || [];
// 如果有绑定的卡，并且之前没有做定位，则进行定位
if (this.existBind && !this.hasResetPosition) {
this.hasResetPosition = true;
this.resetPosition(this.titleTestModelList);
// 否则直接使用当前的位置信息
} else {
this.listData =
res.data.titleTestModelList[
len
].firstSubjectModelList;
this.currentModelIndex = len;
let titleTestModelList = res.data.titleTestModelList || [];
titleTestModelList.splice(1, 1);
this.resetPosition(titleTestModelList);
}
this.$forceUpdate();
// 延迟获取中级职称
this.$nextTick(() => {
setTimeout(() => {
zjListOffsetTop = document.getElementById('zjListRef').offsetTop;
screenHeight = screen.height;
console.log('zjListOffsetTop, screenHeight', zjListOffsetTop, screenHeight);
}, 100);
});
} else {
this.$toast(res.message);
}
......@@ -273,38 +277,63 @@ export default {
resetPosition(list) {
if (!list.length) return;
let parentIndex = 0,
fIndex = 0,
// fIndex = 0,
subIndex = 0,
firstSub = [],
secondSub = [];
outloop: for (let i = 0; i < list.length; i++) {
outloop: for (let i = list.length - 1; i >= 0; i --) {
firstSub = list[i].firstSubjectModelList;
for (let j = 0; j < firstSub.length; j++) {
secondSub = firstSub[j].secondSubjectModelList;
for (let k = 0; k < secondSub.length; k++) {
if (secondSub[k].bindCardStatus) {
if (secondSub[k].bindCardStatus || secondSub[k].bindDirectoryCardStatus) {
parentIndex = i;
fIndex = j;
// fIndex = j;
subIndex = k;
break outloop;
}
}
}
}
this.currentModelIndex = parentIndex;
this.listData =
this.titleTestModelList[parentIndex].firstSubjectModelList || [];
this.$forceUpdate();
this.resetProjectPosition(fIndex, subIndex);
this.resetProjectPosition(parentIndex, subIndex);
},
// 查找对应的职称与专业
resetPositionNew(list) {
console.log('in resetPosition', list);
if (!list.length) return;
let fIndex = 0,
level = 1,
firstSub = [],
secondSub = [];
outloop: for (let i = 0; i < list.length; i++) {
firstSub = list[i].firstSubjectModelList;
for (let j = 0; j < firstSub.length; j++) {
secondSub = firstSub[j].secondSubjectModelList;
if(secondSub.length) {
if(secondSub[0].bindCardStatus) {
level = 1;
}
if(secondSub[0].bindCardStatus || secondSub[0].bindDirectoryCardStatus) {
fIndex = j;
break outloop;
}
}
}
}
this.$forceUpdate();
this.resetProjectPosition(fIndex);
},
// 将定位到的元素，滚动到最上面
resetProjectPosition(fIndex, subIndex) {
resetProjectPosition(parentIndex, subIndex) {
this.$nextTick(() => {
setTimeout(() => {
let scrollTop = document.getElementById(
`subject_${fIndex}_${subIndex}`
`subject_${parentIndex}_${subIndex}`
).offsetTop;
console.log('resetProjectPosition', scrollTop);
window.scrollTo(0, scrollTop - 120);
}, 100);
});
......@@ -313,11 +342,25 @@ export default {
// 监听滚动事件
scrollFun() {
let scrollTop = window.scrollY;
// console.log(scrollTop, screenHeight, zjListOffsetTop);
if(scrollTop + screenHeight - 20 > zjListOffsetTop) {
this.tabIndex = 2;
} else {
this.tabIndex = 1;
}
if (scrollTop >= 500) {
this.needShowBackup = true;
} else {
this.needShowBackup = false;
}
this.$nextTick( () => {
if(window.scrollY <= 5) {
this.tabIndex = 1;
}
})
},
// 滚动到顶部
......@@ -334,9 +377,6 @@ export default {
if(!time) return '';
let year = time.substr(0, 4);
let month = time.substr(5, 2);
// if(month < 10) {
// month = time.substr(6, 1);
// }
return `${year}年${month}月`;
},
......@@ -362,160 +402,163 @@ export default {
}
});
}
}
},
// 页面销毁前注销滚动的监听事件
beforeDestroy() {
window.removeEventListener('scroll');
},
};
</script>
<style lang="less" scoped>
.page-content {
.page-container {
font-size: 14px;
padding-top: 74px;
min-height: 100vh;
.body {
// min-height: 90vh;
display: flex;
flex-direction: row;
font-size: 14px;
color: #676869;
&.body-pt {
padding-top: 40px;
}
.left {
width: 130px;
background: #F8F9FA;
.page-content {
// padding-top: 155px;
// min-height: 100vh;
&-table {
position: fixed;
top: 64px;
left: 0;
z-index: 100;
width: 100%;
text-align: center;
// border-bottom: 1px solid #e7e7e7;
background: #fff;
li {
box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.04);
tr {
font-size: 15px;
font-weight: 700;
height: 44px;
td {
width: 50%;
padding-top: 6px;
.tap-title {
display: flex;
flex-direction: column;
align-items: center;
color: #999;
span:nth-child(2) {
position: relative;
display: block;
height: 60px;
line-height: 60px;
padding-left: 15px;
&.active {
color: #449284;
background: #fff;
&.active::before {
position: absolute;
left: 0;
top: 20px;
z-index: 1;
content: "";
height: 20px;
width: 3px;
border-radius: 2px;
background: #449284;
bottom: -8px;
z-index: 2;
width: 10px;
height: 3px;
background: rgba(255, 255, 255, 1);
border-radius: 3px;
}
}
&.active {
span:nth-child(2) {
background: rgba(68, 146, 132, 1);
}
&.fixed {
position: fixed;
top: 74px;
left: 0;
bottom: 0;
right: 130px;
z-index: 1;
background: #f8f9fa;
&.top {
top: 114px;
}
}
}
.right {
flex: 1;
padding: 0 15px 30px;
.list-wrapper {
.list {
.title {
display: inline-block;
// height: 35px;
padding: 6px 0 10px;
// line-height: 1.2;
margin-top: 14px;
font-size: 15px;
span.android:nth-child(2) {
bottom: -9px;
}
span.ios:nth-child(2) {
bottom: -7px;
}
}
}
}
}
&-list {
margin: 0 15px 10px;
padding: 0 15px;
background: #fff;
padding-bottom: 10px;
border-radius: 6px;
// height: 700px;
.subject {
// padding-bottom: 10px;
& > p, & > p > span {
padding: 5px 0 10px;
font-size: 16px;
font-weight: 700;
color: #373839;
color: #333333;
}
.item-wrapper {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 20px;
.item {
li {
min-height: 60px;
position: relative;
top: 0;
left: 0;
z-index: 1;
z-index: 4;
display: flex;
flex-direction: column;
// height: 55px;
padding: 12px 0;
margin-bottom: 6px;
justify-content: center;
text-align: center;
border-radius: 4px;
background: #f8f9fa;
width: 150px;
height: 40px;
background: rgba(59, 134, 253, 0.05);
border-radius: 6px;
border: 1px solid #3B86FD;
align-items: center;
span {
display: inline-block;
// height: 20px;
line-height: 20px;
padding: 0 20px;
}
&.has-bind {
color: #449284;
background: rgba(68, 146, 132, 0.1);
.buy {
position: absolute;
top: 0;
right: 0;
z-index: 1;
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
font-size: 11px;
color: #fff;
background: #449284;
justify-content: center;
& > img {
width: 14px;
height: 14px;
}
& > span {
margin-left: 4px;
font-size: 14px;
color: #3B86FD;
}
&.no-active {
color: #c7c8c9;
.time {
.buy {
position: absolute;
top: 0;
right: 0;
z-index: 1;
right: -0.02rem;
z-index: 3;
width: 34px;
height: 15px;
line-height: 15px;
padding: 0 4px;
border-radius: 0px 4px 0px 4px;
opacity: 0.4;
font-size: 11px;
background: rgba(0, 0, 0, 1);
}
}
}
}
}
.no-list {
width: 100%;
.item-pre {
display: flex;
flex-direction: column;
width: 150px;
height: 40px;
background: rgba(59, 134, 253, 0.05);
border-radius: 6px;
border: 1px solid #D7DFF0;
align-items: center;
justify-content: center;
align-content: center;
& > .pre {
display: flex;
flex-direction: row;
align-items: center;
margin-top: 60px;
// width: 50px;
// height: 50px;
img {
width: 100px;
height: 100px;
justify-content: center;
& > img {
width: 14px;
height: 14px;
}
span {
& > span {
margin-left: 4px;
color: #D7DFF0;
}
}
& > p {
line-height: 1.2;
font-size: 12px;
color: #c7c8c9;
color: #94A3C1;
}
}
.tk {
background: rgba(255, 90, 110, 0.05);
border-radius: 6px;
border: 1px solid #FF5A6E;
span {
color: #FF5A6E;
}
}
}
}
}
.cb-wrapper {
position: fixed;
z-index: 2;
width: 100%;
}
}
.back-up-icon {
......
src/views/question-bank.vue
浏览文件 @ 6753de57
......@@ -22,7 +22,7 @@
<div class="course-item" v-for="(item, index) in subDirectoryModelList" :key="index">
<div class="left-c">
<p class="title-c">{{item.directoryName}}</p>
<p class="join-c" v-if="!bindStatus">{{item.joinUserNum}}人已参与</p>
<p class="join-c" v-if="!bindStatus">共{{item.sumTitle}}题 | {{item.joinUserNum}}人已参与</p>
<div class="progress-course" v-else>
<div class="progress-w"><van-progress :percentage="item.finishedRatio" :stroke-width="6" color="#449284" :show-pivot="false"/></div>
<span class="mg-set">{{item.finishedRatio}}%</span><span>共{{item.sumTitle}}道</span>
......@@ -31,6 +31,8 @@
<div class="right-btn">
<span v-if="!bindStatus && (item.freeFlag == 0)" @click="goStudy(item, '开始练习')">开始练习</span>
<span v-if="!bindStatus && (item.freeFlag == 1) && (item.freePractice > 0)" @click="goStudy(item, '免费练习')">免费练习</span>
<p v-if="!bindStatus && (item.freeFlag == 1) && (item.freePractice > 0)">可练习{{item.freePractice}}题</p>
<img v-if="!bindStatus && (item.freeFlag == 1) && (item.freePractice == 0)" src="../images/question/lock.png" @click="unlockHand">
<span v-if="bindStatus == 1" @click="goStudy(item, setTxt(item.finishedRatio))">{{setTxt(item.finishedRatio)}}</span>
</div>
......@@ -594,6 +596,7 @@ export default {
}
.right-btn{
display: flex;
flex-direction: column;
align-items: center;
span{
display: inline-block;
......@@ -612,6 +615,11 @@ export default {
height: 15px;
margin-right: 22.5px;
}
p {
margin-top: 4px;
font-size: 12px;
color: #CAA861;
}
}
}
}
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或