Skip to content

Y
year-end-activitiy
提交 ef6e2dc5 编写于 作者: Yuanzhao.dai's avatar Yuanzhao.dai
浏览文件
操作

Merge branch 'dev-stage2-20191125' of... 

Merge branch 'dev-stage2-20191125' of http://192.168.110.53/com.pica.cloud.foundation.frontend/year-end-activitiy into dev-stage2-20191125
上级 1e62b6f0 1fc2f305
隐藏空白字符变更
内嵌 并排
正在显示 包含 698 行增加 和 220 行删除
assets/style/index.less
浏览文件 @ ef6e2dc5
.index-wrap{ .index-wrap {
div{ div {
width: 375px; width: 375px;
img{
width: 375px; img {
display: block; width: 375px;
} display: block;
} }
.wrap-join{ }
height: 72.5px;
background: url(../img/img4.png) no-repeat center center; .wrap-join {
background-size: 100% 100%; height: 72.5px;
.wrap-count{ background: url(../img/img4.png) no-repeat center center;
width: 325px; background-size: 100% 100%;
height: 72.5px;
display: flex; .wrap-count {
margin: 0 auto; width: 325px;
h1{ height: 72.5px;
margin-top: 9px; display: flex;
font-size:23px; margin: 0 auto;
font-weight:700;
color:rgba(255,255,255,1); h1 {
line-height:32.5px; margin-top: 9px;
text-align: center; font-size: 23px;
} font-weight: 700;
h5{ color: rgba(255, 255, 255, 1);
font-size:14px; line-height: 32.5px;
font-weight:400; text-align: center;
color:rgba(255,255,255,0.59); }
line-height:20px;
text-align: center; h5 {
} font-size: 14px;
} font-weight: 400;
color: rgba(255, 255, 255, 0.59);
line-height: 20px;
text-align: center;
}
} }
.btn-app-share{ }
img{
width: 312px; .btn-app-share {
height: 51.5px; img {
margin: 0 auto; width: 312px;
} height: 51.5px;
margin: 0 auto;
} }
.btn-appoint{ }
height: 94.5px;
background: url(../img/img5.png) no-repeat center center; .btn-appoint {
background-size: 100% 100%; height: 94.5px;
img{ background: url(../img/img5.png) no-repeat center center;
padding-top: 15px; background-size: 100% 100%;
}
.appoint-time{ img {
margin-top: 5px; padding-top: 15px;
text-align: center;
font-size:12px;
color:rgba(237,90,44,1);
line-height:16.5px;
}
} }
.btn-share{
height: 166px; .appoint-time {
background: url(../img/img11.png) no-repeat center center; margin-top: 5px;
background-size: 100% 100%; text-align: center;
img{ font-size: 12px;
padding-top: 81px; color: rgba(237, 90, 44, 1);
} line-height: 16.5px;
} }
.rule-show{ }
background:rgba(254,124,86,1);
.bird{ .btn-share {
width: 22.5px; height: 166px;
height: 28.5px; background: url(../img/img11.png) no-repeat center center;
margin: 0 auto; background-size: 100% 100%;
padding: 24px 0;
img {
padding-top: 81px;
}
}
.rule-show {
background: rgba(254, 124, 86, 1);
.bird {
width: 22.5px;
height: 28.5px;
margin: 0 auto;
padding: 24px 0;
}
.rule-bg {
width: 345px;
margin: 0 auto;
box-sizing: border-box;
background: rgba(236, 107, 69, 1);
border-radius: 12px;
padding: 15px;
section {
h1 {
font-size: 16px;
font-weight: 700;
color: rgba(255, 234, 136, 1);
line-height: 18px;
margin-bottom: 12px;
}
p {
font-size: 14px;
font-weight: 500;
color: rgba(255, 246, 202, 1);
line-height: 19px;
margin-bottom: 9px;
span {
font-weight: 700;
}
} }
.rule-bg{ }
width:345px;
margin:0 auto; .margin-top-20 {
box-sizing: border-box; margin-top: 20px;
background:rgba(236,107,69,1); }
border-radius:12px;
padding: 15px; .line {
section{ margin-top: 20px;
h1{ width: 309.5px;
font-size:16px; height: .5px;
font-weight:700; background: #FFF6CA;
color:rgba(255,234,136,1); }
line-height:18px;
margin-bottom: 12px; .btn-rule {
} width: 110px;
p{ height: 15px;
font-size:14px; font-size: 15px;
font-weight:500; color: rgba(255, 255, 255, 1);
color:rgba(255,246,202,1); line-height: 15px;
line-height:19px; margin: 0 auto;
margin-bottom: 9px; padding: 16.5px 0 1.5px 0;
span{
font-weight:700; img {
} width: 7px;
} height: 12px;
} display: inline;
.margin-top-20{ vertical-align: middle;
margin-top: 20px; padding-left: 5px;
}
.line{
margin-top: 20px;
width:309.5px;
height:.5px;
background: #FFF6CA;
}
.btn-rule{
width: 110px;
height: 15px;
font-size:15px;
color:rgba(255,255,255,1);
line-height:15px;
margin: 0 auto;
padding: 16.5px 0 1.5px 0;
img{
width: 7px;
height: 12px;
display: inline;
vertical-align: middle;
padding-left: 5px;
}
}
} }
}
}
}
.fix-btn {
width: 375px;
height: 50px;
position: fixed;
left: 0;
bottom: 0;
z-index: 10;
background: #fff;
div {
width: 345px;
height: 40px;
background: linear-gradient(270deg, rgba(255, 88, 36, 1) 0%, rgba(254, 163, 86, 1) 100%);
border-radius: 20px;
margin: 5px auto 0 auto;
font-size: 15px;
color: rgba(255, 255, 255, 1);
line-height: 40px;
text-align: center;
}
}
.abs-btn {
width: 69px;
height: 25px;
position: absolute;
right: 0;
top: 260px;
img {
width: 69px;
height: 25px;
} }
.fix-btn{ }
width: 375px; }
.padbtm50 {
padding-bottom: 50px;
}
// 微信分享助力活动
.wx-share-wrap {
width: 375px;
height: 601.5px;
button,input{
appearance: none;
border: none;
outline: none;
}
section {
width: 375px;
height: 601.5px;
padding-bottom: 27.5px;
background: url(../img/bgtop.png) no-repeat;
background-size: 100% 100%;
.invite-info{
img{
width: 50px;
height: 50px; height: 50px;
position: fixed; display: block;
left: 0; padding-top: 20px;
bottom: 0; margin: 0 auto;
z-index: 10; }
background: #fff; .title1{
margin-top: 12px;
margin-bottom: 8px;
text-align: center;
font-size:20px;
font-weight:700;
color:rgba(255,255,255,1);
line-height:20px;
text-shadow:0px 2px 10px rgba(222,77,16,1);
}
.title2{
margin-bottom: 23px;
text-align: center;
font-size:13px;
color:rgba(255,255,255,1);
line-height:13px;
text-shadow:0px 2px 10px rgba(231,93,48,1);
}
}
.page-info{
width:345px;
height:162px;
padding: 20px 25px;
box-sizing: border-box;
margin: 0 auto 16px auto;
background:rgba(255,255,255,1);
border-radius:6px;
.title1{
margin-bottom: 8px;
text-align: center;
font-size:16px;
font-weight:700;
color:rgba(55,56,57,1);
line-height:16px;
}
.title2{
margin-bottom: 16px;
text-align: center;
font-size:12px;
color:rgba(248,94,71,1);
line-height:12px;
}
.imgs-wrap{
display: flex;
justify-content: space-between;
div{ div{
width: 345px; border-radius: 6px;
height: 40px; img{
background:linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%); width: 50px;
border-radius:20px; height: 50px;
margin: 5px auto 0 auto; display: block;
font-size:15px; margin: 0 auto;
color:rgba(255,255,255,1); }
line-height:40px; .img-txt{
text-align: center; margin-top: 8px;
font-size:12px;
color:rgba(103,104,105,1);
line-height:12px;
}
} }
}
} }
.abs-btn{ .form-info{
width: 69px; width:345px;
height: 25px; // height:162px;
position: absolute; padding: 15px;
right: 0; box-sizing: border-box;
top: 260px; margin: 0 auto 16px auto;
img{ background:rgba(255,255,255,1);
width: 69px; border-radius:6px;
height: 25px; .field-wrap{
display: flex;
justify-content: flex-start;
width: 315px;
height: 45px;
line-height: 45px;
padding: 0 20px;
box-sizing: border-box;
background:rgba(248,249,250,1);
border-radius:22.5px;
margin-bottom: 10px;
position: relative;
.cap-box{
width: 90px;
height: 35px;
top: 5px;
right: 5px;
position: absolute;
img{
width: 100%;
height: 100%;
display: block;
border-radius:22.5px;
}
}
button{
width:56px;
height:40px;
top: 2.5px;
right: 20px;
position: absolute;
font-size:14px;
color:rgba(151,152,153,1);
line-height:40px;
background: none;
} }
label{
margin-top: 2.5px;
font-size:14px;
font-weight:700;
display: block;
width: 112px;
height: 40px;
line-height: 40px;
color:rgba(55,56,57,1);
}
input{
margin-top: 2.5px;
font-size:14px;
width: 130px;
height: 40px;
line-height:40px;
background: none;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color:rgba(199,200,201,1);
height: 40px;
line-height:40px;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color:rgba(199,200,201,1);
height: 40px;
line-height:40px;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color:rgba(199,200,201,1);
height: 40px;
line-height:40px;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color:rgba(199,200,201,1);
height: 40px;
line-height:40px;
}
}
.btn-post{
width: 315px;
height: 45px;
margin-top: 10px;
background:linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%);
border-radius:22.5px;
font-size:15px;
font-weight:700;
color:rgba(255,255,255,1);
line-height:15px;
}
} }
} }
.padbtm50{
padding-bottom: 50px;
} }
\ No newline at end of file
assets/style/revant.less
浏览文件 @ ef6e2dc5
.remind-success{ .remind-success {
width: 300px; width: 300px;
.van-dialog__header{
font-size:18px; .van-dialog__header {
color:rgba(51,51,51,1); font-size: 18px;
line-height:18px; color: rgba(51, 51, 51, 1);
padding-top: 30px; line-height: 18px;
padding-top: 30px;
}
.van-dialog__content {
.van-dialog__message {
padding: 14px 24px 30px 24px;
text-align: left;
font-size: 14px;
color: rgba(103, 104, 105, 1);
line-height: 21px;
span {
font-size: 14px;
color: #449284;
line-height: 21px;
}
} }
.van-dialog__content{ }
.van-dialog__message{
padding: 14px 24px 30px 24px; .van-dialog__footer {
text-align: left; .van-dialog__cancel {
font-size:14px; .van-button__text {
color:rgba(103,104,105,1); font-size: 17px;
line-height:21px; color: rgba(151, 152, 153, 1);
span{ line-height: 24px;
font-size:14px; }
color:#449284;
line-height:21px;
}
}
} }
.van-dialog__footer{
.van-dialog__cancel{ .van-dialog__confirm {
.van-button__text{ .van-button__text {
font-size:17px; font-size: 17px;
color:rgba(151,152,153,1); color: rgba(68, 146, 132, 1);
line-height:24px; line-height: 24px;
} }
}
.van-dialog__confirm{
.van-button__text{
font-size:17px;
color:rgba(68,146,132,1);
line-height:24px;
}
}
} }
}
} }
.version-toast{
width: 320px; .version-toast {
.van-dialog__header{ width: 320px;
font-size:18px;
color:rgba(51,51,51,1); .van-dialog__header {
line-height:18px; font-size: 18px;
padding-top: 30px; color: rgba(51, 51, 51, 1);
line-height: 18px;
padding-top: 30px;
}
.van-dialog__content {
.van-dialog__message {
font-size: 14px;
color: rgba(103, 104, 105, 1);
line-height: 21px;
} }
.van-dialog__content{ }
.van-dialog__message{
font-size:14px; .van-dialog__footer {
color:rgba(103,104,105,1); border: .5px solid rgba(0, 0, 0, .3);
line-height:21px;
} .van-dialog__cancel {
.van-button__text {
font-size: 17px;
color: rgba(151, 152, 153, 1);
line-height: 24px;
}
} }
.van-dialog__footer{
border: .5px solid rgba(0,0,0,.3); .van-dialog__confirm {
.van-dialog__cancel{ .van-button__text {
.van-button__text{ font-size: 17px;
font-size:17px; color: rgba(68, 146, 132, 1);
color:rgba(151,152,153,1); line-height: 24px;
line-height:24px; }
}
}
.van-dialog__confirm{
.van-button__text{
font-size:17px;
color:rgba(68,146,132,1);
line-height:24px;
}
}
} }
}
}
.wx-share-wrap {
.van-count-down {
line-height: 45px;
right: 20px;
position: absolute;
}
} }
\ No newline at end of file
pages/shareActive.vue 0 → 100644
浏览文件 @ ef6e2dc5
<template>
<div class="wx-share-wrap">
<section>
<div class="invite-info">
<img :src="avatarImageUrl" />
<p class="title1">{{ name }}邀请您助力 为他赢大奖</p>
<p class="title2">领取课程即可助他一臂之力</p>
</div>
<div class="page-info">
<p class="title1">资深医生讲师、精选专业课程</p>
<p class="title2">已有超过20,000+的医生领取以下课程</p>
<div class="imgs-wrap">
<div>
<img src="../assets/img/ico1.png" />
<div class="img-txt">高血压课程</div>
</div>
<div>
<img src="../assets/img/ico2.png" />
<div class="img-txt">糖尿病课程</div>
</div>
<div>
<img src="../assets/img/ico3.png" />
<div class="img-txt">中医课程</div>
</div>
<div>
<img src="../assets/img/ico4.png" />
<div class="img-txt">全科课程</div>
</div>
</div>
</div>
<div class="form-info">
<div class="field-wrap">
<label>联系方式</label>
<input v-model="mobilePhone" type="tel" maxlength="11" placeholder="请输入手机号">
</div>
<div class="field-wrap">
<label>图形验证码</label>
<input v-model="captchaAnswer" type="text" maxlength="6" placeholder="请输入">
<div class="cap-box"><img :src="captchaImg" @click="getCaptcha"></div>
</div>
<div class="field-wrap">
<label>短信验证码</label>
<input v-model="authCode" type="tel" maxlength="6" placeholder="请输入">
<button v-if="notSend" @click="sendSms">{{btnMsg}}</button>
<van-count-down v-if="!notSend" :time="time" @finish="finishCount" :format="'ss' + 's'" />
</div>
<button class="btn-post" @click="getCourse">领取课程</button>
</div>
</section>
</div>
</template>
<script>
import { getInviteInfo, getCourseById, getCaptchaGet, getAuthCode } from '@/service';
const TIMEALL = 60000; // 倒计时常量 60 秒
export default {
data(){
return {
notSend: true,
mobilePhone: '',
authCode: '', // 短信验证码
flag: 0,
captchaImg: '', // 图形验证码图片字段
captchaToken: '', // captchaToken
captchaAnswer: '', // 输入的图形验证码
time: TIMEALL,
btnMsg: '点击获取'
}
},
async asyncData({ query }){
const { id, taskId, activityId } = query;
let avatarImageUrl, name, mobilePhone;
const res = await getInviteInfo(id);
if(res.code=='000000'){
const data = res.data;
avatarImageUrl = data.avatarImageUrl;
name = data.name ? data.name : data.mobilePhone;
}
return {
avatarImageUrl, name, id, taskId, activityId
}
},
mounted(){
this.getCaptcha();
},
methods: {
// 点击刷新验证码
getCaptcha(){
getCaptchaGet().then(res=>{
if(res.code==='000000'){
this.captchaImg = `data:image/png;base64,${res.data.content}`;
this.captchaToken = res.data.token;
}else{
this.$toast(res.message);
}
})
},
// 领取课程事件
getCourse(){
if(this.mobilePhone=='' || this.mobilePhone.length!=11){
this.$toast('请输入正确的手机号');
return;
}
if(this.authCode==''){
this.$toast('请输入短信验证码');
return;
}
const { mobilePhone, authCode, id, taskId, activityId } = this;
// 调用领取课程接口
getCourseById({
mobile: mobilePhone,
authCode,
id,
taskId,
activityId
}).then(res=>{
if(res.code=='000000'){
// res.data true 登记成功 、 false 登记失败
this.$router.push({
name: 'shareResult',
query: {
status: res.data
}
})
}else {
this.$toast(res.message);
}
})
},
// 发送获取短信验证码
sendSms(){
if(this.mobilePhone=='' || this.mobilePhone.length!=11){
this.$toast('请输入正确的手机号');
return;
}
// 校验图形验证码
if(this.captchaAnswer==''){
this.$toast('请输入图形验证码');
return;
}
// this.notSend = false;
const { mobilePhone, flag, captchaToken, captchaAnswer } = this;
getAuthCode({mobilePhone, flag, captchaToken, captchaAnswer}).then(res=>{
// 发送成功
if(res.code=='000000'){
this.notSend = false;
}else{
this.$toast(res.message);
this.getCaptcha();
}
})
},
// 倒计时结束
finishCount(){
this.time = TIMEALL;
this.notSend = true;
this.btnMsg = '重新获取';
}
}
}
</script>
<style lang="less" scoped>
@import '../assets/style/index.less';
</style>
<style lang="less">
@import '../assets/style/revant.less';
</style>
\ No newline at end of file
pages/shareResult.vue 0 → 100644
浏览文件 @ ef6e2dc5
<template>
<div>
<h1>result-share</h1>
</div>
</template>
<script>
export default {
asyncData({ query }){
console.log(query)
const { status } = query; // 上个页面传递过来领取结果， false 为已领取， true 为领取成功
}
}
</script>
\ No newline at end of file
plugins/vueComponent.js
浏览文件 @ ef6e2dc5
import Vue from 'vue' import Vue from 'vue'
import { BASE_URL } from '@/utils/enumerate'; import {
BASE_URL
} from '@/utils/enumerate';
import PicaWxShare from 'pica-wx-share'; import PicaWxShare from 'pica-wx-share';
Vue.prototype.$picaWxShare = PicaWxShare; Vue.prototype.$picaWxShare = PicaWxShare;
import PicaH5Login from 'pica-h5-login'; import PicaH5Login from 'pica-h5-login';
import { Dialog, Toast, Checkbox,Popup ,CheckboxGroup ,RadioGroup, Radio, Progress,ImagePreview ,Uploader,Overlay,Loading } from 'vant'; import {
import WebBuriedPoint, { sendBuriedData } from 'web-buried-point'; CountDown,
Field,
Cell,
CellGroup,
Button,
Dialog,
Toast,
Checkbox,
Popup,
CheckboxGroup,
RadioGroup,
Radio,
Progress,
ImagePreview,
Uploader,
Overlay,
Loading
} from 'vant';
import WebBuriedPoint, {
sendBuriedData
} from 'web-buried-point';
Vue.use(Popup).use(Checkbox).use(CheckboxGroup).use(RadioGroup).use(Radio).use(Progress).use(ImagePreview).use(Uploader).use(Overlay).use(Loading); Vue.use(CountDown).use(Field).use(Cell).use(CellGroup).use(Button).use(Popup).use(Checkbox).use(CheckboxGroup).use(RadioGroup).use(Radio).use(Progress).use(ImagePreview).use(Uploader).use(Overlay).use(Loading);
Vue.use(PicaH5Login); Vue.use(PicaH5Login);
Vue.use(Toast) Vue.use(Toast)
Vue.use(Dialog) Vue.use(Dialog)
const { NUXT_ENV_APP } = process.env; const {
NUXT_ENV_APP
} = process.env;
Vue.use(WebBuriedPoint, { Vue.use(WebBuriedPoint, {
class_name: `year_end_ssr`, class_name: `year_end_ssr`,
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1` url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
}); });
Vue.prototype.$sendBuriedData = sendBuriedData; Vue.prototype.$sendBuriedData = sendBuriedData;
\ No newline at end of file \ No newline at end of file
service/index.js
浏览文件 @ ef6e2dc5
...@@ -42,6 +42,7 @@ export const getRemindStatus = async (token) => { ...@@ -42,6 +42,7 @@ export const getRemindStatus = async (token) => {
}) })
} }
// 校验token是否有效
export const checkToken = async (token) => { export const checkToken = async (token) => {
return request({ return request({
url: `campaign/admin/task/checkToken?token=${token}`, url: `campaign/admin/task/checkToken?token=${token}`,
...@@ -50,4 +51,42 @@ export const checkToken = async (token) => { ...@@ -50,4 +51,42 @@ export const checkToken = async (token) => {
token: token token: token
} }
}) })
} }
\ No newline at end of file
// 获取邀请人的头像和名字信息
export const getInviteInfo = async (id) => {
return request({
url: `campaign/inviteOne/info?id=${id}`,
method: 'get'
})
}
// 领取课程 POST
export const getCourseById = ({ mobile, authCode, id, taskId, activityId }) => {
return request({
url: `campaign/inviteOne/invited`,
method: 'post',
data: {
mobile, authCode, id, taskId, activityId
},
})
}
// 获取图形验证码
export const getCaptchaGet = () => {
return request({
url: `account/account/captcha`,
method: 'get'
})
}
// 获取短信验证码
export const getAuthCode = ({ mobilePhone, flag, captchaToken, captchaAnswer }) => {
return request({
url: `account/account/authCode`,
method: 'get',
params: {
mobilePhone, flag, captchaToken, captchaAnswer
},
})
}
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或