提交 8fc810b2 编写于 作者: tao.wu's avatar tao.wu

联调领取课程接口

上级 cf58bc76
.index-wrap{
div{
width: 375px;
img{
width: 375px;
display: block;
}
.index-wrap {
div {
width: 375px;
img {
width: 375px;
display: block;
}
.wrap-join{
height: 72.5px;
background: url(../img/img4.png) no-repeat center center;
background-size: 100% 100%;
.wrap-count{
width: 325px;
height: 72.5px;
display: flex;
margin: 0 auto;
h1{
margin-top: 9px;
font-size:23px;
font-weight:700;
color:rgba(255,255,255,1);
line-height:32.5px;
text-align: center;
}
h5{
font-size:14px;
font-weight:400;
color:rgba(255,255,255,0.59);
line-height:20px;
text-align: center;
}
}
}
.wrap-join {
height: 72.5px;
background: url(../img/img4.png) no-repeat center center;
background-size: 100% 100%;
.wrap-count {
width: 325px;
height: 72.5px;
display: flex;
margin: 0 auto;
h1 {
margin-top: 9px;
font-size: 23px;
font-weight: 700;
color: rgba(255, 255, 255, 1);
line-height: 32.5px;
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;
height: 51.5px;
margin: 0 auto;
}
}
.btn-app-share {
img {
width: 312px;
height: 51.5px;
margin: 0 auto;
}
.btn-appoint{
height: 94.5px;
background: url(../img/img5.png) no-repeat center center;
background-size: 100% 100%;
img{
padding-top: 15px;
}
.appoint-time{
margin-top: 5px;
text-align: center;
font-size:12px;
color:rgba(237,90,44,1);
line-height:16.5px;
}
}
.btn-appoint {
height: 94.5px;
background: url(../img/img5.png) no-repeat center center;
background-size: 100% 100%;
img {
padding-top: 15px;
}
.btn-share{
height: 166px;
background: url(../img/img11.png) no-repeat center center;
background-size: 100% 100%;
img{
padding-top: 81px;
}
.appoint-time {
margin-top: 5px;
text-align: center;
font-size: 12px;
color: rgba(237, 90, 44, 1);
line-height: 16.5px;
}
}
.btn-share {
height: 166px;
background: url(../img/img11.png) no-repeat center center;
background-size: 100% 100%;
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-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;
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;
}
}
}
.margin-top-20{
margin-top: 20px;
}
.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;
}
}
}
.margin-top-20 {
margin-top: 20px;
}
.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;
}
.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;
}
}
}
.padbtm50 {
padding-bottom: 50px;
}
// 微信分享助力活动
.wx-share-wrap {
width: 375px;
height: 601.5px;
section {
width: 375px;
height: 601.5px;
background: url(../img/bgtop.png) no-repeat;
background-size: 100% 100%;
.invite-info{
img{
width: 50px;
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;
}
display: block;
padding-top: 20px;
margin: 0 auto;
}
.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);
}
}
.abs-btn{
width: 69px;
height: 25px;
position: absolute;
right: 0;
top: 260px;
img{
width: 69px;
height: 25px;
.page-info{
width:345px;
height:162px;
padding: 20px 25px;
box-sizing: border-box;
margin: 0 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{
text-align: center;
font-size:12px;
color:rgba(248,94,71,1);
line-height:12px;
}
.imgs-wrap{
div{
h3{
font-size:12px;
color:rgba(103,104,105,1);
line-height:12px;
}
}
}
}
}
.padbtm50{
padding-bottom: 50px;
}
}
\ No newline at end of file
<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" />
<h3>高血压课程</h3>
</div>
<div>
<img src="../assets/img/ico2.png" />
<h3>糖尿病课程</h3>
</div>
<div>
<img src="../assets/img/ico3.png" />
<h3>中医课程</h3>
</div>
<div>
<img src="../assets/img/ico4.png" />
<h3>全科课程</h3>
</div>
</div>
</div>
<div class="form-info">
<van-cell-group>
<van-field
v-model="mobile"
label="联系方式"
placeholder="请输入手机号"
/>
<van-field
v-model="captcha"
label="图形验证码"
placeholder="请输入"
/>
<van-field
v-model="authCode"
center
clearable
label="短信验证码"
placeholder="请输入"
>
<van-button slot="button" size="small" type="primary">发送验证码</van-button>
</van-field>
</van-cell-group>
<van-button @click="getCourse" slot="button" type="primary">领取课程</van-button>
</div>
</section>
</div>
</template>
<script>
import { getInviteInfo, getCourseById } from '@/service';
export default {
data(){
return {
mobile: '18217314361',
authCode: '1234', // 短信验证码
captcha: '', // 图形验证码
}
},
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, mobilePhone, id, taskId, activityId
}
},
methods: {
getCourse(){
const { mobile, authCode, id, taskId, activityId } = this;
getCourseById({
mobile,
authCode,
id,
taskId,
activityId
}).then(res=>{
console.log('领取课程调用===>', res);
if(res.code=='000000' && res.data){
// 登记成功 / 领取成功
}else if(res.code=='000000' && !res.data){
// 登记失败 / 领取失败
}else {
this.$toast(res.message);
}
})
}
}
}
</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
import Vue from 'vue'
import { BASE_URL } from '@/utils/enumerate';
import {
BASE_URL
} from '@/utils/enumerate';
import PicaWxShare from 'pica-wx-share';
Vue.prototype.$picaWxShare = PicaWxShare;
import PicaH5Login from 'pica-h5-login';
import { Dialog, Toast, Checkbox,Popup ,CheckboxGroup ,RadioGroup, Radio, Progress,ImagePreview ,Uploader,Overlay,Loading } from 'vant';
import WebBuriedPoint, { sendBuriedData } from 'web-buried-point';
import {
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(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(Toast)
Vue.use(Dialog)
const { NUXT_ENV_APP } = process.env;
const {
NUXT_ENV_APP
} = process.env;
Vue.use(WebBuriedPoint, {
class_name: `year_end_ssr`,
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
});
Vue.prototype.$sendBuriedData = sendBuriedData;
\ No newline at end of file
class_name: `year_end_ssr`,
url: `${BASE_URL[NUXT_ENV_APP]}/file/log/trace1`
});
Vue.prototype.$sendBuriedData = sendBuriedData;
\ No newline at end of file
......@@ -42,6 +42,7 @@ export const getRemindStatus = async (token) => {
})
}
// 校验token是否有效
export const checkToken = async (token) => {
return request({
url: `campaign/admin/task/checkToken?token=${token}`,
......@@ -50,4 +51,23 @@ export const checkToken = async (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
},
})
}
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册