Skip to content

Y
year-end-activitiy
提交 df4a3810 编写于 作者: tao.wu's avatar tao.wu
浏览文件
操作

Merge remote-tracking branch 'origin/dev-stage2-20191125' into dev-stage2-20191125

上级 1c8eb378 a41d13ea
隐藏空白字符变更
内嵌 并排
正在显示 包含 557 行增加 和 61 行删除
pages/in-activity.vue
浏览文件 @ df4a3810
......@@ -19,7 +19,7 @@
<p class="date">12月27至30日</p>
</li> -->
<li v-for="item in stageDateList" :class="">
<li v-for="(item, index) in stageDateList" :class="returnStageClass(item, index)">
<p class="title">{{ item.title }}</p>
<p class="date">{{ item.date }}</p>
</li>
......@@ -28,16 +28,16 @@
<div class="big-bg-wrap">
<div class="award-wrap">
<div class="stage-rule">
<img class="stage-text" src="../assets/img/stageTwo/stage-01-text.png" alt="">
<img class="stage-text" :src="returnStageText()" alt="">
<img class="rule-btn" src="../assets/img/stageTwo/rule-btn.png" alt="" @click="handleRuleBtnClick">
</div>
<img class="reward-pic" src="../assets/img/stageTwo/award-01-pic.png" alt="">
<img class="reward-pic" :src="returnAwardPic()" alt="">
</div>
<!-- 未登录 -->
<div v-if="!isLogin" class="not-login-wrap">
<img class="gold-coin" src="../assets/img/stageTwo/gold-coin.png" alt="">
<img class="head-icon" src="../assets/img/stageTwo/not-login-icon.png" alt="">
<img class="head-icon" src="../assets/img/stageTwo/default-login-icon.png" alt="">
<div class="content-info">
<p class="not-login-text">您还未登录</p>
<p class="tips">登录并加入机构参加活动</p>
......@@ -48,9 +48,10 @@
<!-- 已登录，但没有加入机构 -->
<div v-if="isLogin && !isJoin" class="not-login-wrap ">
<img class="gold-coin" src="../assets/img/stageTwo/gold-coin.png" alt="">
<img class="head-icon" src="../assets/img/stageTwo/not-login-icon.png" alt="">
<img class="head-icon" v-if="doctorInfo.avatarImageUrl" :src="doctorInfo.avatarImageUrl" alt="">
<img class="head-icon" v-else src="../assets/img/stageTwo/default-login-icon.png" alt="">
<div class="content-info">
<p class="not-login-text">{{appUserInfo.userName}}</p>
<p class="not-login-text">{{ doctorInfo.name }}</p>
<p class="tips">尚未加入一个机构</p>
</div>
<div class="go-login login-but-nojoin" @click="goToJoin">加入机构<img src="../assets/img/stageTwo/right-icon-small.png" alt=""></div>
......@@ -62,11 +63,12 @@
<img class="gold-coin" src="../assets/img/stageTwo/gold-coin.png" alt="">
<div class="basic-info">
<div class="head-icon">
<img src="../assets/img/stageTwo/default-doctor-icon.png" alt="">
<img v-if="doctorInfo.avatarImageUrl" :src="doctorInfo.avatarImageUrl" alt="">
<img v-else src="../assets/img/stageTwo/default-login-icon.png" alt="">
</div>
<div class="name-info">
<p class="name">召唤</p>
<p class="company">上海复旦大学附属中山医院</p>
<p class="name">{{ doctorInfo.name }}</p>
<p class="company">{{ doctorInfo.hospital }}</p>
</div>
<div @click="goToUserDetail" class="detail">个人明细<img src="../assets/img/stageTwo/right-icon-small.png" alt=""></div>
</div>
......@@ -112,19 +114,43 @@
<p class="invite-tips">每邀请1位医生好友领取课程，+20勤奋分 +20云鹊豆</p>
<div class="invite-list-wrap">
<ul class="invite-list">
<!-- 已邀请的 -->
<li v-for="item in inviteList">
<img @click="eachDoctorClick" v-if="item.avatarImageUrl" class="doctor-icon" :src="item.avatarImageUrl" alt="">
<img @click="eachDoctorClick" v-else class="doctor-icon" src="../assets/img/stageTwo/default-doctor-icon.png" alt="">
<p class="text">{{ item.doctorName ? item.doctorName : item.mobile }}</p>
</li>
<!-- 未邀请的 -->
<template v-if="inviteList && inviteList.length < 4">
<li v-for="item in notInviteShowList">
<template v-if="!isLogin || !isJoin">
<li>
<div class="add-btn" @click="eachDoctorClick">
<img src="../assets/img/stageTwo/add-pic-icon.png" alt="">
</div>
</li>
<li>
<div class="add-btn" @click="eachDoctorClick">
<img src="../assets/img/stageTwo/add-pic-icon.png" alt="">
</div>
</li>
<li>
<div class="add-btn" @click="eachDoctorClick">
<img src="../assets/img/stageTwo/add-pic-icon.png" alt="">
</div>
</li>
<li>
<div class="add-btn" @click="eachDoctorClick">
<img src="../assets/img/stageTwo/add-pic-icon.png" alt="">
</div>
</li>
</template>
<template v-if="isLogin && isJoin">
<!-- 已邀请的 -->
<li v-for="item in inviteList">
<img @click="eachDoctorClick" v-if="item.avatarImageUrl" class="doctor-icon" :src="item.avatarImageUrl" alt="">
<img @click="eachDoctorClick" v-else class="doctor-icon" src="../assets/img/stageTwo/default-doctor-icon.png" alt="">
<p class="text">{{ item.doctorName ? item.doctorName : item.mobile }}</p>
</li>
<!-- 未邀请的 -->
<template v-if="inviteList && inviteList.length < 4">
<li v-for="item in notInviteShowList">
<div class="add-btn" @click="eachDoctorClick">
<img src="../assets/img/stageTwo/add-pic-icon.png" alt="">
</div>
</li>
</template>
</template>
<!-- 查看更多 -->
<li>
......@@ -209,20 +235,26 @@
<script>
import { getInviteList } from '@/service/activityMainpage';
import { checkHospitalStatus } from '@/service';
import { Toast } from 'vant';
const cookies = require('cookie-universal')();
let vm = null;
export default {
data () {
return {
// isFirstFresh: true,
serverTime: '',
isLogin: false, // 是否 已登录
isJoin: true, // 是否 已加入机构 默认为false
isJoin: false, // 是否 已加入机构 默认为false
joinStatus: 3, // 1-已加入机构 2-机构在审核中状态 3-未加入机构
currentStage: 0, // 当前处于第几阶段 0表示不在四个阶段里，1-4表示对应阶段
stageDateList: [
{ date: '12月16至19日', beginDate: '2019-12-16', endDate: '2019-12-19', title: '高血压学习' },
{ date: '12月20至23日', beginDate: '2019-12-20', endDate: '2019-12-23', title: '糖尿病学习' },
{ date: '12月24至26日', beginDate: '2019-12-24', endDate: '2019-12-26', title: '中医科学习' },
{ date: '12月27至29日', beginDate: '2019-12-27', endDate: '2019-12-29', title: '全科学习' },
{ date: '12月16至19日', beginDate: '2019/12/16 00:00:00', endDate: '2019/12/19 23:59:59', title: '高血压学习' },
{ date: '12月20至23日', beginDate: '2019/12/20 00:00:00', endDate: '2019/12/23 23:59:59', title: '糖尿病学习' },
{ date: '12月24至26日', beginDate: '2019/12/24 00:00:00', endDate: '2019/12/26 23:59:59', title: '中医学习' },
{ date: '12月27至29日', beginDate: '2019/12/27 00:00:00', endDate: '2019/12/29 23:59:59', title: '全科学习' },
],
appUserInfo: {
......@@ -235,6 +267,9 @@
},
doctorInfo: {
name: '', // 接口返回用户名字或者手机号带遮掩
hospital: '', // 机构名称
avatarImageUrl: '', // 头像URL
userDayScore: '1000', // 用户当日勤奋分
userDayRank: '5', // 用户当日排名
hospitalScore: '6000', // 机构累计勤奋分
......@@ -269,58 +304,90 @@
// if(){
// }else{
// return '../assets/img/stageTwo/not-login-icon.png';
// return '../assets/img/stageTwo/default-login-icon.png';
// }
// },
// 顶部类似tab的显示逻辑
topDateStatus(item) {
// 获取当前时间？ 前端自己获取，还是 有个接口来返回服务器时间
let currentTime = new Date().getTime();
let beginDate = item.beginDate.split('-');
let endDate = item.endDate.split('-');
let beginTime = new Date(beginDate[0], beginDate[1], beginDate[2]).getTime();
let endTime = new Date(endDate[0], endDate[1], endDate[2]).getTime();
if( currentTime < beginTime ){
return '';
}
},
// topDateStatus(item) {
// },
},
created() {
vm = this;
// 取服务器时间，切换不同时间段的显示
vm.getServerTime();
},
mounted() {
vm.$rocNative.appInit();
vm.getUserInfo();
vm.getUserInfo(); // 判断是否登录
// if (process.client) {
// window.__refresh = function(params) {
// vm.isFirstFresh = false;
// }
// }
if (process.client) {
window.__refresh = function(params) {
vm.getUserInfo(); // 判断是否登录
}
}
},
methods: {
// 获取服务器时间
getServerTime() {
// 调取接口获取服务器时间
let serverTime = 11111;
},
returnStageText() {
if(vm.currentStage == 0){
return '';
}else{
return require(`../assets/img/stageTwo/stage-0${vm.currentStage}-text.png`);
}
},
returnAwardPic() {
if(vm.currentStage == 0){
return '';
}else{
return require(`../assets/img/stageTwo/award-0${vm.currentStage}-pic.png`)
}
},
returnStageClass(item, index){ // 返回顶部四个时间进度条状态
// debugger;
// 获取当前服务器时间 获取失败则用本地时间
let currentTime = 1577030400000;
let beginTime = new Date(item.beginDate).getTime();
let endTime = new Date(item.endDate).getTime();
let status = '';
if( currentTime < beginTime ){ // 未开始
status = '';
}else if( (currentTime == beginTime) || (beginTime < currentTime && currentTime < endTime) || (currentTime == endTime) ){ // 活动中
status = 'active';
vm.currentStage = index + 1;
}else{ // 已结束
status = 'over';
};
return status;
},
// 判断用户是否登录？
getUserInfo() {
vm.$rocNative
.getUserInfo()
.then(params => {
// _seft.userToken = params.userToken; // 存到store里
if(params && params.userToken){
cookies.set('token', params.userToken)
}
alert(JSON.stringify(params));
if(params && params.userMobile){
if(params && params.userMobile){ // 已登录 （有手机号表示 已登录，无手机号表示 未登录）
vm.isLogin = true;
vm.appUserInfo = params;
alert('已经获取了 登录token了')
// 登录且加入机构才获取医生邀请了的列表 ？？？？？？？？？？？？？？？？？？ 还是 已登录就获取，不论是否加入机构？
vm.loginCallback();
}else{
// alert('没获取到登录信息！！！')
}else{ // 未登录
vm.isLogin = false;
}
});
},
......@@ -331,6 +398,50 @@
},
// 登陆ok后 回调： 获取邀请的医生列表等。。
loginCallback() {
vm.getUserActivityInfo();
vm.goToCheckJoin();
},
getUserActivityInfo() { // 获取用户及参加活动的具体信息
// 请求接口
vm.doctorInfo = {
name: '云鹊医', // 接口返回用户名字或者手机号带遮掩
hospital: '上海协和医院', // 机构名称
avatarImageUrl: 'https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1575272062&di=90feeb5bbc9d7f7122f74be154c6f69c&src=http://b-ssl.duitang.com/uploads/item/201709/06/20170906180625_YNysd.jpeg', // 头像URL
userDayScore: '111', // 用户当日勤奋分
userDayRank: '222', // 用户当日排名
hospitalScore: '333', // 机构累计勤奋分
hospitalRank: '444', // 机构累计排名
userTotalBonus: '555', // 个人累计获得云鹊豆
hospitalLevelScore: [111, 222, 333], // 三阶段达标分值, 数组返回
targetRequiredScore: '99', // 再获得多少分 // 再获得10勤奋分即可上升到前10名获得欧姆龙温度计
targetRank: '3', // 上升到多少名
};
},
goToCheckJoin() { // 检查是否加入结构
checkHospitalStatus(vm.appUserInfo.userToken).then(res => {
alert('jiandddddd')
alert(JSON.stringify(res))
if(res && res.code == '000000' ){
const status = res.data.status;
// const status = 15; // test。。。。。。。。。。。。。。。。。
alert('是否加入机构'); alert(status)
if (status && status == 1) { // 机构状态正常
vm.isJoin = true;
vm.joinStatus = 1;
vm.handleGetInviteList(); //登录且已加入机构才获取医生邀请了的列表
}else if (status && status == 15) { // 15创建机构审核中
vm.isJoin = false;
vm.joinStatus = 2;
}else { // 除了1,15 都是未加入机构
vm.isJoin = false;
vm.joinStatus = 3;
}
}else{
vm.$toast(res.message);
}
});
},
handleGetInviteList() {
let token = '5463439BE4444FF8BC47CC4575E9D550'; // 开发时用这个调用数据
// let token = vm.appUserInfo.userToken; // 正式上线 用这个！！！！
getInviteList(token).then(res => {
......@@ -357,6 +468,8 @@
vm.inviteList = [];
}
}else{
vm.$toast(res.message);
}
})
},
......@@ -366,15 +479,54 @@
},
// 去登录
goToLogin() {
console.log('去登录...');
alert('去登录...');
vm.appLogin();
},
// 去加入机构
goToJoin() {
console.log('去加入机构...')
alert('去加入机构...')
// 用户点击【加入机构】，继续判断用户是否有创建机构在审核状态，若有，则弹出弹窗提示。若无则跳转加入机构页面
if( vm.joinStatus == 2 ){ // 机构审核中
alert('去机构审核中。。。。')
this.$dialog.confirm({
title: '提醒',
message: `抱歉，您创建的机构【${vm.doctorInfo.hospital}】正在审核中，审核通过后可参与活动<br/><br/>如有疑问可联系客：<span>400-920-8877</span><br/>(周一至周五9:00-18:00)`,
confirmButtonText: '查看进度',
cancelButtonText: '我知道了',
className: 'remind-success',
}).then(() => {
this.checkVersion(()=>{
if (this.$rocNative.isAndroid) {
this.$rocNative.setNeedClearUrl({ url: 'year_end_ssr' });
}
this.$rocNative.gotoInstitutionalReview({ url: window.location.href });
});
});
}else if( vm.joinStatus == 3 ){ // 未加入机构
alert('未加入机构。。。。。')
this.checkVersion(()=>{
if (this.$rocNative.isAndroid) {
this.$rocNative.setNeedClearUrl({ url: 'year_end_ssr' });
}
this.$rocNative.gotoActivityHospital({ url: window.location.href });
})
}
},
checkVersion(callback){
this.$rocNative.getAppVersionCode().then(res => {
const appVersion = parseFloat(res.versionCode.replace(/\./g, ''));
if(appVersion>=317){
callback();
}else{
this.$dialog.alert({
message: '当前app版本过低，请升级版本后继续操作',
className: 'version-toast'
});
}
});
},
handleLoginCheck(cb) {
if( !this.isLogin ){ // 未登录 >>> 去登录
this.goToLogin();
......@@ -387,20 +539,20 @@
// 跳转至 个人明细
goToUserDetail() {
console.log('跳转至 个人明细')
alert('跳转至 个人明细')
},
// 查看个人榜单
goToUserBoard() {
console.log('跳转至 个人榜单')
alert('跳转至 个人榜单')
},
// 查看机构榜单
goToOrganBoard() {
console.log('跳转至 机构榜单')
alert('跳转至 机构榜单')
},
// 云鹊豆中心
goToBeanCenter() {
console.log('云鹊豆中心')
alert('云鹊豆中心')
},
// “邀请医生好友学课程” 列表中的每一个医生点击事件
......@@ -411,7 +563,7 @@
// 去每个li医生详情页 ??????
goToDoctorPage() {
//“被邀请的用户模块“点击逻辑，点击用户头像、“+“或者查看更多，都跳转至邀请详情页
console.log('去邀请详情页....')
alert('去邀请详情页....')
},
......@@ -422,7 +574,7 @@
},
// 跳转至 “查看更多” 页面
seeInviteMore() {
console.log('去查看更多页面...');
alert('去查看更多页面...');
},
// 去邀请 按钮
......@@ -464,4 +616,7 @@
<style lang="less">
@import '../assets/style/in-activity.less';
</style>
<style lang="less">
@import '../assets/style/revant.less';
</style>
\ No newline at end of file
pages/invite-details/index.less 0 → 100644
浏览文件 @ df4a3810
.invite-details-wrap {
.main-container {
overflow: hidden;
.invite-explain {
padding: 0 15px;
margin: 20px 0 30px 0;
.title {
color: #333333;
font-size: 18px;
font-weight: 700;
}
.picture-explain {
display: flex;
justify-content: space-between;
margin-top: 18px;
.left {
width: 18px;
display: flex;
flex-flow: column;
align-items: center;
margin-top: 13px;
.step-num {
width: 18px;
height: 18px;
line-height: 18px;
text-align: center;
border-radius: 100%;
background: #F36F55;
color: #fff;
font-size: 12px;
}
.dotted-line {
border-left: 1px dashed #F36F55;
height:38px;
width: 1px;
}
.height50 {
height: 50px!important;
}
}
.right {
.bubble_diailog{
width: 275px;
padding: 12px 15px;
position: relative;
background: #FFF4F2;
border-radius: 6px;
color: #373839;
font-size: 14px;
font-weight: 700;
i,.bubble_diailog b{
position: absolute;
width: 0;
height: 0;
overflow: hidden;
border-width:5px;
display:block;
}
i.l,.bubble_diailog b.l{
border-style:dashed solid dashed dashed;
}
i.l{
top:0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
left:-10px;
border-color:transparent #FFF4F2 transparent transparent;
}
b.l{
top:0;
bottom: 0;
margin-top: auto;
margin-bottom: auto;
left:-9px;
border-color:transparent #FFF4F2 transparent transparent;
}
p {
line-height: 14px;
}
.text {
color: #373839;
font-size: 14px;
font-weight: 700;
}
.awards {
color: #979899;
font-size: 12px;
font-weight: 400;
margin-top: 6px;
}
};
.marginTop16 {
margin-top: 8px;
}
.marginTop20 {
margin-top: 10px;
}
}
}
}
.gray-line {
width: 100%;
height: 5px;
background: #F8F9FA;
}
.record-details {
.tab-nav {
height: 52px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #E7E8E9;
.item {
height: 52px;
line-height: 52px;
position: relative;
font-size: 16px;
color: #676869;
.active-line {
width: 20px;
height: 3px;
background: #F36F55;
border-radius: 1.5px;
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
}
}
.left-item {
margin-left: 82.5px;
}
.right-item {
margin-right: 82.5px;
}
}
.record-list {
padding: 15px;
.sum {
color: #676869;
font-size: 14px;
}
.record-item {
padding: 20px 0;
display: flex;
align-items: center;
.person-photo {
width: 35px;
height: 35px;
border-radius: 100%;
}
.person-info {
margin-left: 15px;
.phone {
color: #373839;
font-size: 16px;
line-height: 16px;
}
.time {
color: #979899;
font-size: 13px;
line-height: 13px;
margin-top: 8px;
}
}
.awards {
margin-left: auto;
.item {
font-size: 13px;
font-weight: 700;
height: 13px;
margin-bottom: 9px;
.num {
color: #FD5A2F;
}
.award-name {
color: #373839;
}
}
.item:last-child {
margin-bottom: 0;
}
}
}
}
}
.no-data {
img {
width: 150px;
height: 150px;
display: block;
margin: 5px auto;
}
p {
width: 180px;
height: 42px;
font-size: 15px;
color: #999999;
line-height: 21px;
margin: 0 auto;
text-align: center;
}
.text-get {
width: 300px;
}
}
.footer-btn {
width: 100%;
height: 40px;
padding: 5px 0;
box-shadow:0px -1px 0px 0px rgba(237,237,237,1);
position: fixed;
bottom: 0;
.btn {
width: 345px;
height: 40px;
margin: 0 auto;
line-height: 40px;
text-align: center;
background: linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%);
border-radius: 20px;
color: #FFFFFF;
font-weight: 700;
font-size: 15px;
}
}
}
}
\ No newline at end of file
pages/invite-details/index.vue 0 → 100644
浏览文件 @ df4a3810
<template>
<section class="invite-details-wrap">
<normal-header
:title="title"
:barHeight="barHeight"
:barColor="barColor"
:backType="1">
</normal-header>
<div class="main-container" :style="{ marginTop: `${44+barHeight}Px`}">
<div class="invite-explain">
<p class="title">邀请形式</p>
<div class="picture-explain">
<div class="left">
<div class="step-num">1</div>
<div class="dotted-line" />
<div class="step-num">2</div>
<div class="dotted-line height50" />
<div class="step-num">3</div>
</div>
<div class="right">
<div class="bubble_diailog">
<i class="l"></i>
<b class="l"></b>
邀请医生好友
</div>
<div class="bubble_diailog marginTop16">
<i class="l"></i>
<b class="l"></b>
<p class="text">输入手机号领取课程</p>
<p class="awards">+20勤奋分 +20云鹊豆</p>
</div>
<div class="bubble_diailog marginTop20">
<i class="l"></i>
<b class="l"></b>
<p class="text">使用手机号登录云鹊APP</p>
<p class="awards">+80勤奋分 +80云鹊豆</p>
</div>
</div>
</div>
</div>
<div class="gray-line"></div>
<div class="record-details">
<div class="tab-nav">
<div class="item left-item">
领取记录
<p class="active-line"></p>
</div>
<div class="item right-item">
登录记录
<p class="active-line"></p>
</div>
</div>
<!-- <div class="record-list">
<p class="sum">共10人</p>
<div class="record-item">
<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="" class="person-photo">
<div class="person-info">
<p class="phone">135****3456</p>
<p class="time">2019.12.16</p>
</div>
<div class="awards">
<p class="item">
<span class="num">+5</span>
<span class="award-name">勤奋分</span>
</p>
<p class="item">
<span class="num">+5</span>
<span class="award-name">勤奋分</span>
</p>
</div>
</div>
</div>-->
<div class="no-data">
<img src="~/assets/img/invite-details/icon-nodata.png" alt="">
<!-- <p>提醒您的医生好友领取课程您将获得奖励哦！</p>-->
<p class="text-get">提醒您的医生好友领取课程后登录云鹊医APP您将再获得奖励哦！</p>
</div>
<div class="footer-btn">
<div class="btn">去邀请</div>
</div>
</div>
</div>
</section>
</template>
<script>
import NormalHeader from '@/components/normal-header'
export default {
name: "index",
components: {
NormalHeader
},
data() {
return {
showPop: false,
title: '邀请明细',
barHeight: 0,
barColor: '#fff',
};
},
mounted() {
},
methods: {},
}
</script>
<style scoped lang="less">
@import 'index.less';
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或