Skip to content

H
h5-base
Commit 9337be67 authored by chenyishuai@singsingenglish.com's avatar chenyishuai@singsingenglish.com
Browse files
Options

71

parents 244ae216 85af8177
Hide whitespace changes
Inline Side-by-side
Showing with 704 additions and 852 deletions
src/components/mine/address.vue
View file @ 9337be67
...@@ -24,11 +24,16 @@ ...@@ -24,11 +24,16 @@
<div class="text"> <div class="text">
<p>地址修改时间：{{deliverDetail.updated_at}}</p> <p>地址修改时间：{{deliverDetail.updated_at}}</p>
<p v-if="deliverDetail.express_no">发货时间：{{deliverDetail.deliver_at}}</p> <p v-if="deliverDetail.express_no">发货时间：{{deliverDetail.deliver_at}}</p>
<div v-if="deliverDetail.express_no"> <div v-if="deliverDetail.express_no && deliverDetail.status === '1'" class="express-no">
物流信息：{{deliverDetail.express_name}} {{deliverDetail.express_no}} <span>物流信息：</span>
<span style="flex: 1;">{{deliverDetail.express_name}} {{deliverDetail.express_no}}</span>
<van-button round size="small" @click="search(1)" type="info">查看物流</van-button> <van-button round size="small" @click="search(1)" type="info">查看物流</van-button>
</div> </div>
<div v-if="!deliverDetail.express_no">物流信息：- -</div> <div v-if="deliverDetail.express_no && deliverDetail.status === '0'" class="express-no">
<span>物流信息：</span>
<span style="flex: 1;">待发货</span>
</div>
<!-- <div v-if="!deliverDetail.express_no">物流信息：- -</div> -->
</div> </div>
</div> </div>
</div> </div>
...@@ -56,12 +61,21 @@ ...@@ -56,12 +61,21 @@
<div class="timeInfo"> <div class="timeInfo">
<div class="text"> <div class="text">
<p>地址修改时间：{{noDeliverDetail.updated_at}}</p> <p>地址修改时间：{{noDeliverDetail.updated_at}}</p>
<p v-if="!noDeliverDetail.express_no">预计发货时间：{{noDeliverDetail.deliver_start_at}}</p> <p
<div v-if="noDeliverDetail.express_no"> v-if="!noDeliverDetail.express_no"
>预计发货时间：{{noDeliverDetail.deliver_start_at}}-{{noDeliverDetail.deliver_end_at}}</p>
<div
v-if="noDeliverDetail.express_no && noDeliverDetail.status === '1'"
style="justify-content:space-between;"
>
物流信息：{{noDeliverDetail.express_name}} {{noDeliverDetail.express_no}} 物流信息：{{noDeliverDetail.express_name}} {{noDeliverDetail.express_no}}
<van-button round size="small" @click="search(2)" type="info">查看物流</van-button> <van-button round size="small" @click="search(2)" type="info">查看物流</van-button>
</div> </div>
<div v-if="!noDeliverDetail.express_no">物流信息：- -</div> <div
v-if="noDeliverDetail.express_no && noDeliverDetail.status === '0'"
style="justify-content:space-between;"
>物流信息：待发货</div>
<!-- <div v-if="!noDeliverDetail.express_no">物流信息：- -</div> -->
</div> </div>
</div> </div>
</div> </div>
...@@ -75,7 +89,7 @@ ...@@ -75,7 +89,7 @@
style="text-align: center;padding-top: 20vh;font-size: 5vw;" style="text-align: center;padding-top: 20vh;font-size: 5vw;"
>{{addressInfo.msg}}</div> >{{addressInfo.msg}}</div>
</div> </div>
<!-- <div class="address2"> <!-- <div class="address2">
<div class="content"> <div class="content">
<div class="top"> <div class="top">
<span>{{addressInfo.receive_name}}</span> <span>{{addressInfo.receive_name}}</span>
...@@ -90,7 +104,7 @@ ...@@ -90,7 +104,7 @@
<p>(最新地址修改时间：{{addressInfo.updated_at}})</p> <p>(最新地址修改时间：{{addressInfo.updated_at}})</p>
<p>*若要修改收货地址，请联系您的专属班主任老师</p> <p>*若要修改收货地址，请联系您的专属班主任老师</p>
</div> </div>
</div> --> </div>-->
</template> </template>
<script> <script>
...@@ -190,6 +204,10 @@ export default { ...@@ -190,6 +204,10 @@ export default {
background: #f5f5f9; background: #f5f5f9;
.van-button { .van-button {
margin-left: 20 * @toVw; margin-left: 20 * @toVw;
margin-right: 20 * @toVw;
}
.van-button__text {
padding: 10 * @toVw;
} }
.head { .head {
i { i {
...@@ -241,13 +259,18 @@ export default { ...@@ -241,13 +259,18 @@ export default {
font-size: 12 * @toVw; font-size: 12 * @toVw;
margin-left: 0; margin-left: 0;
line-height: 26 * @toVw; line-height: 26 * @toVw;
width: 100%;
.express-no {
display: flex;
justify-content: space-between;
}
} }
.right { .right {
margin-top: 43 * @toVw; margin-top: 43 * @toVw;
} }
.van-button--info { .van-button--info {
background: white; background: white;
width: 74 * @toVw; // width: 74 * @toVw;
color: #60adf0; color: #60adf0;
border-color: #60adf0; border-color: #60adf0;
} }
...@@ -264,7 +287,8 @@ export default { ...@@ -264,7 +287,8 @@ export default {
-webkit-transform: scale(1, 0.5); -webkit-transform: scale(1, 0.5);
} }
.tip { .tip {
padding: 10 * @toVw 20 * @toVw; width: 90%;
margin: 10 * @toVw auto;
color: #999999; color: #999999;
font-size: 12 * @toVw; font-size: 12 * @toVw;
line-height: 23 * @toVw; line-height: 23 * @toVw;
......
src/components/mine/index.vue
View file @ 9337be67
...@@ -74,7 +74,7 @@ import { mineImage } from "../../util/imgUrl"; ...@@ -74,7 +74,7 @@ import { mineImage } from "../../util/imgUrl";
import { Cell, Toast } from "vant"; import { Cell, Toast } from "vant";
import { import {
getStarSumberApi, getStarSumberApi,
// getUserAdressApi, getUserAdressApi,
getNewestAddressListAPi, getNewestAddressListAPi,
getUserDetailApi getUserDetailApi
} from "../../service/api"; } from "../../service/api";
...@@ -86,7 +86,7 @@ export default { ...@@ -86,7 +86,7 @@ export default {
}, },
data() { data() {
return { return {
isShowAddress: true, isShowAddress: false,
noDeliverDetail: null, //下期收货地址 noDeliverDetail: null, //下期收货地址
deliverDetail: null, //本期收货地址 deliverDetail: null, //本期收货地址
image: mineImage, image: mineImage,
...@@ -109,32 +109,47 @@ export default { ...@@ -109,32 +109,47 @@ export default {
// getUserAdressApi().then(res => { // getUserAdressApi().then(res => {
// this.addressInfo = res; // this.addressInfo = res;
// }); // });
getNewestAddressListAPi().then(res => { getNewestAddressListAPi()
if (res) { .then(res => {
if (res.deliver_detail && res.deliver_detail.length > 0) { if (res) {
this.deliverDetail = res.deliver_detail; if (res.deliver_detail && res.deliver_detail.length > 0) {
} this.deliverDetail = res.deliver_detail[0];
if (res.no_deliver_detail && res.no_deliver_detail.length > 0) { }
this.noDeliverDetail = res.no_deliver_detail; if (res.no_deliver_detail && res.no_deliver_detail.length > 0) {
} this.noDeliverDetail = res.no_deliver_detail[0];
if (!this.deliverDetail && !this.noDeliverDetail) { }
this.isShowAddress = false; if (!this.deliverDetail && !this.noDeliverDetail) {
} this.isShowAddress = false;
if (this.deliverDetail && this.noDeliverDetail) { }
if ( if (this.deliverDetail && this.noDeliverDetail) {
this.deliverDetail.express_no &&
this.deliverDetail.express_no.length === 0
) {
if ( if (
this.noDeliverDetail.express_no && (this.deliverDetail.express_no &&
this.noDeliverDetail.express_no.length === 0 this.deliverDetail.express_no.length > 0) ||
(this.noDeliverDetail.express_no &&
this.noDeliverDetail.express_no.length > 0)
) { ) {
this.isShowAddress = false; this.isShowAddress = true;
}
if (
this.deliverDetail.express_no &&
this.deliverDetail.express_no.length === 0
) {
if (
this.noDeliverDetail.express_no &&
this.noDeliverDetail.express_no.length === 0
) {
this.isShowAddress = false;
}
} }
} }
} }
} })
}); .then(res => {
console.log(res);
})
.catch(error => {
console.log(JSON.stringify(error));
});
if (this.userDetail.mobile) { if (this.userDetail.mobile) {
this.phoneNumber = this.userDetail.mobile; this.phoneNumber = this.userDetail.mobile;
} }
......
src/components/newLesson/index.vue
View file @ 9337be67
...@@ -10,521 +10,721 @@ ...@@ -10,521 +10,721 @@
<!--横屏导航--> <!--横屏导航-->
<div class="header-h" v-if="!nowLesson.old"> <div class="header-h" v-if="!nowLesson.old">
<i :class="{headerHP:true, defaultLook:nowShow !== 1,lookHP:nowShow===1}" @click="type=1"> <i :class="{headerHP:true, defaultLook:nowShow !== 1,lookHP:nowShow===1}" @click="type=1">
<img :src="HP.look2" alt=""> <img :src="HP.look2" alt />
</i> </i>
<i :class="{headerHP:true, defaultPlay:nowShow !== 2,playHP:nowShow===2}" @click="type=2"> <i :class="{headerHP:true, defaultPlay:nowShow !== 2,playHP:nowShow===2}" @click="type=2">
<img :src="HP.play2" alt=""> <img :src="HP.play2" alt />
</i> </i>
<i :class="{headerHP:true, defaultFun:nowShow !== 3,funHP:nowShow===3}" @click="type=3"> <i :class="{headerHP:true, defaultFun:nowShow !== 3,funHP:nowShow===3}" @click="type=3">
<img :src="HP.listen1" alt=""> <img :src="HP.listen1" alt />
</i> </i>
<i class="headerHP home" @click="backList"> <i class="headerHP home" @click="backList">
<img :src="HP.back" alt=""> <img :src="HP.back" alt />
</i> </i>
</div> </div>
<!--老课包返回按钮--> <!--老课包返回按钮-->
<img :src="backUrl" v-if="nowLesson.old" @click="backList" class="backImg"> <img :src="backUrl" v-if="nowLesson.old" @click="backList" class="backImg" />
<!--内容--> <!--内容-->
<div :class="{'index-content-block':true,radius:nowShow !== 1 || nowLesson.old}"> <div :class="{'index-content-block':true,radius:nowShow !== 1 || nowLesson.old}">
<look-block v-if="nowLesson.type === 'text'" :contentData="nowLesson" @backList="backList" /> <look-block v-if="nowLesson.type === 'text'" :contentData="nowLesson" @backList="backList" />
<video-block v-if="nowLesson.type === 'video'" :contentData="nowLesson" :nowShow="nowShow" @backList="backList"/> <video-block
<audio-block v-if="nowLesson.type === 'audio'" :contentData="nowLesson" @backList="backList" /> v-if="nowLesson.type === 'video'"
:contentData="nowLesson"
:nowShow="nowShow"
@backList="backList"
/>
<audio-block v-if="nowLesson.type === 'audio'" :contentData="nowLesson" @backList="backList" />
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import {subUserLessonApi,getUserWatchApi,getwechatParam} from "../../service/api"; import {
import {Toast} from 'vant' subUserLessonApi,
import lookBlock from './look' getUserWatchApi,
import videoBlock from './video' getwechatParam
import backUrl from '../../assets/newLesson/back.png' } from "../../service/api";
import {HP} from '../../util/imgUrl.js' import { Toast } from "vant";
import audioBlock from './audio' import lookBlock from "./look";
export default { import videoBlock from "./video";
name: "index", import backUrl from "../../assets/newLesson/back.png";
data(){ import { HP } from "../../util/imgUrl.js";
let query import audioBlock from "./audio";
console.log(this.$store.state.classQuery.periods_id) export default {
if(this.$store.state.classQuery.periods_id){ name: "index",
query = this.$store.state.classQuery data() {
}else{ let query;
// debugger console.log(this.$store.state.classQuery.periods_id);
query = JSON.parse(sessionStorage.getItem('classQuery')) if (this.$store.state.classQuery.periods_id) {
} query = this.$store.state.classQuery;
} else {
// debugger // debugger
return { query = JSON.parse(sessionStorage.getItem("classQuery"));
backUrl:backUrl, }
periods_id:query.periods_id, // debugger
category_id:query.category_id, return {
elementId:query.elementId, backUrl: backUrl,
lesson:null, periods_id: query.periods_id,
nowShow:0, category_id: query.category_id,
page_id :1, elementId: query.elementId,
stillTime:0, lesson: null,
watchDetail:null, nowShow: 0,
timeInterval:null, page_id: 1,
nowLesson:{ stillTime: 0,
type:'', watchDetail: null,
content:null, timeInterval: null,
age:1, nowLesson: {
}, type: "",
HP:HP, content: null,
type:1 age: 1
}
},
watch: {
type() {
this.changeTitle(this.type)
}
},
components:{
lookBlock,
videoBlock,
audioBlock
},
mounted(){
this.initPage();
},
methods:{
enableShare: function(option) {
let that = this;
getwechatParam({
api_list: 'onMenuShareAppMessage,onMenuShareTimeline',
url:window.location.href.split('#')[0]
}).then(wechatRes => {
wx.config({
debug: false,
appId: wechatRes.appId,
timestamp: parseInt(wechatRes.timestamp),
nonceStr: wechatRes.nonceStr,
signature: wechatRes.signature,
jsApiList: wechatRes.jsApiList
});
wx.ready(function() {
wx.onMenuShareTimeline({
title: option.product_title, // 分享标题
desc: option.desc,// 分享描述
link: option.shareUrl, // 分享链接
imgUrl: option.shareIcon || 'https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png', // 分享图标
success: function() {
// debugger
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail'));
let nowTime = Date.parse(new Date());
let json = {
page_type:0,
page_id:6,
stay_time:0,
};
subUserLessonApi(that.elementId,that.category_id,that.periods_id,json).then(res=>{
lessonDetail.total_watch_time = res.total_watch_time;
lessonDetail.nowTime = nowTime;
lessonDetail.star_num = res.total_star_num;
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail));
});
},
cancel: function() {
}
});
wx.onMenuShareAppMessage({
title: option.product_title, // 分享标题
desc: option.desc,// 分享描述
link: option.shareUrl, // 分享链接
imgUrl: option.shareIcon || 'https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png', // 分享图标
success: function() {
console.log(that.elementId)
// debugger
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail'));
let nowTime = Date.parse(new Date());
let json = {
page_type:0,
page_id:6,
stay_time:0,
};
subUserLessonApi(that.elementId,that.category_id,that.periods_id,json).then(res=>{
lessonDetail.total_watch_time = res.total_watch_time;
lessonDetail.nowTime = nowTime;
lessonDetail.star_num = res.total_star_num;
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail));
});
},
cancel: function() {
}
});
})
})
},
onShare(URL) {
this.enableShare({
product_title: `我家宝宝正在【唱唱启蒙英语】挑战童谣，已坚持${this.watchDetail.total_day}天`, // 分享标题
desc: JSON.parse(localStorage.getItem('userDesc')).nickname+`赠您【领取超值课程】特权，来唱唱和百万家庭一起快乐启蒙英语吧！`,//
shareIcon:'https://cdn.singsingenglish.com/logo/logo.jpg',
shareUrl:URL
})
},
backList(){
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail'));
let nowTime = Date.parse(new Date());
let lookTime = (nowTime- lessonDetail.nowTime)/1000;
console.log(this.lesson)
this.$sa.track('watchClick',{
buttonName:'返回课程列表',
partName:this.nowShow == 1 ? '爸妈看一看' : this.nowShow == 2 ? '宝贝玩一玩' : this.nowShow == 3 ? '磨磨小耳朵' : '',
elementID:this.lesson.id.toString(),
dayModule:this.lesson.domTitle.slice(0,9),
weekName:this.lesson.domTitle.slice(10,this.lesson.domTitle.length),
elementName:this.lesson.domTitle.slice(0,9) + '-'+ this.lesson.domTitle.slice(10,this.lesson.domTitle.length),
themeID:this.lesson.themeID,
themeName:this.lesson.themeName,
goodsID:this.lesson.goodsID,
classID:this.lesson.classID
});
let json = {
page_type:0,
page_id:this.page_id,
stay_time:lookTime,
};
subUserLessonApi(this.elementId,this.category_id,this.periods_id,json).then(res=>{
lessonDetail.total_watch_time = res.total_watch_time;
lessonDetail.nowTime = nowTime;
lessonDetail.star_num = res.total_star_num;
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail));
let query={
periods_id:this.periods_id,
course_type:this.course_type,
parent_category_id:this.parent_category_id,
back_id:this.category_id
};
console.log(query)
// debugger
this.$router.push({name:'map',query:query})
});
}, },
changeTitle(type){ HP: HP,
// if(type==type) type: 1
Toast.loading({ };
mask: true, },
message: '' watch: {
}); type() {
this.nowShow = type; this.changeTitle(this.type);
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail')); }
let nowTime = Date.parse(new Date()); },
let lookTime = (nowTime- lessonDetail.nowTime)/1000; components: {
let json = { lookBlock,
page_type:0, videoBlock,
page_id:this.page_id, audioBlock
stay_time:lookTime, },
}; mounted() {
console.log(lookTime) // this.changeTitle(this.type);
subUserLessonApi(this.elementId,this.category_id,this.periods_id,json).then(res=>{ this.initPage();
Toast.clear() },
lessonDetail.total_watch_time = res.total_watch_time; methods: {
lessonDetail.nowTime = nowTime; enableShare: function(option) {
lessonDetail.star_num = res.total_star_num; let that = this;
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail)); getwechatParam({
api_list: "onMenuShareAppMessage,onMenuShareTimeline",
url: window.location.href.split("#")[0]
}).then(wechatRes => {
wx.config({
debug: false,
appId: wechatRes.appId,
timestamp: parseInt(wechatRes.timestamp),
nonceStr: wechatRes.nonceStr,
signature: wechatRes.signature,
jsApiList: wechatRes.jsApiList
}); });
switch (type) { wx.ready(function() {
case 1: wx.onMenuShareTimeline({
// 神策埋点 板块切换 title: option.product_title, // 分享标题
this.$sa.track('learnPart',{ desc: option.desc, // 分享描述
partName:'爸妈看一看', link: option.shareUrl, // 分享链接
elementID:this.lesson.id.toString(), imgUrl:
dayModule:this.lesson.domTitle.slice(0,9), option.shareIcon ||
weekName:this.lesson.domTitle.slice(10,this.lesson.domTitle.length), "https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png", // 分享图标
elementName:this.lesson.domTitle.slice(0,9) + '-'+ this.lesson.domTitle.slice(10,this.lesson.domTitle.length), success: function() {
themeID:this.lesson.themeID, // debugger
themeName:this.lesson.themeName, let lessonDetail = JSON.parse(
goodsID:this.lesson.goodsID, localStorage.getItem("lessonDetail")
classID:this.lesson.classID, );
is_view_today:!!new Date().setHours(0, 0, 0, 0) === new Date(this.lesson.push_time).setHours(0, 0, 0, 0) let nowTime = Date.parse(new Date());
}); let json = {
this.page_id = 1; page_type: 0,
this.nowLesson = { page_id: 6,
type:'text', stay_time: 0
title:1,
partName:'爸妈看一看',
content:this.lesson.content.look,
age:this.nowLesson.age
};
// debugger
break;
case 2:
// 神策埋点 板块切换
this.$sa.track('learnPart',{
partName:'宝贝玩一玩',
elementID:this.lesson.id.toString(),
dayModule:this.lesson.domTitle.slice(0,9),
weekName:this.lesson.domTitle.slice(10,this.lesson.domTitle.length),
elementName:this.lesson.domTitle.slice(0,9) + '-'+ this.lesson.domTitle.slice(10,this.lesson.domTitle.length),
themeID:this.lesson.themeID,
themeName:this.lesson.themeName,
goodsID:this.lesson.goodsID,
classID:this.lesson.classID,
is_view_today:!!new Date().setHours(0, 0, 0, 0) === new Date(this.lesson.push_time).setHours(0, 0, 0, 0)
});
this.page_id = 2;
if(this.lesson.content.play.type){
this.nowLesson = {
type:'audio',
title:2,
partName:'宝贝玩一玩',
content:this.lesson.content.play,
age:this.nowLesson.age
}; };
}else{ subUserLessonApi(
this.nowLesson = { that.elementId,
type:'video', that.category_id,
title:2, that.periods_id,
partName:'宝贝玩一玩', json
content:this.lesson.content.play, ).then(res => {
age:this.nowLesson.age lessonDetail.total_watch_time = res.total_watch_time;
}; lessonDetail.nowTime = nowTime;
} lessonDetail.star_num = res.total_star_num;
break; localStorage.setItem(
case 3: "lessonDetail",
this.$sa.track('learnPart',{ JSON.stringify(lessonDetail)
partName:'磨磨小耳朵', );
elementID:this.lesson.id.toString(), });
dayModule:this.lesson.domTitle.slice(0,9), },
weekName:this.lesson.domTitle.slice(10,this.lesson.domTitle.length), cancel: function() {}
elementName:this.lesson.domTitle.slice(0,9) + '-'+ this.lesson.domTitle.slice(10,this.lesson.domTitle.length), });
themeID:this.lesson.themeID, wx.onMenuShareAppMessage({
themeName:this.lesson.themeName, title: option.product_title, // 分享标题
goodsID:this.lesson.goodsID, desc: option.desc, // 分享描述
classID:this.lesson.classID, link: option.shareUrl, // 分享链接
is_view_today:!!new Date().setHours(0, 0, 0, 0) === new Date(this.lesson.push_time).setHours(0, 0, 0, 0) imgUrl:
}); option.shareIcon ||
this.page_id = 5; "https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png", // 分享图标
if(this.lesson.content.fun.type){ success: function() {
this.nowLesson = { let lessonDetail = JSON.parse(
type:'audio', localStorage.getItem("lessonDetail")
title:3, );
partName:'磨磨小耳朵', let nowTime = Date.parse(new Date());
content:this.lesson.content.fun, let json = {
age:this.nowLesson.age page_type: 0,
}; page_id: 6,
}else{ stay_time: 0
this.nowLesson = {
type:'video',
partName:'磨磨小耳朵',
title:3,
content:this.lesson.content.fun,
age:this.nowLesson.age
}; };
} subUserLessonApi(
break; that.elementId,
} that.category_id,
that.periods_id,
}, json
initPage(){ ).then(res => {
Toast.loading({ lessonDetail.total_watch_time = res.total_watch_time;
mask: true, lessonDetail.nowTime = nowTime;
message: '' lessonDetail.star_num = res.total_star_num;
localStorage.setItem(
"lessonDetail",
JSON.stringify(lessonDetail)
);
});
},
cancel: function() {}
});
}); });
console.log(this.$store.state.classQuery) });
this.parent_category_id = this.$route.query.parent_category_id },
this.course_type = this.$route.query.course_type onShare(URL) {
// debugger this.enableShare({
getUserWatchApi().then(res=>{ product_title: `我家宝宝正在【唱唱启蒙英语】挑战童谣，已坚持${this.watchDetail.total_day}天`, // 分享标题
this.watchDetail = res; desc:
this.$store.dispatch('setWatchDetail',this.watchDetail) JSON.parse(localStorage.getItem("userDesc")).nickname +
let URL = process.env.API_URL+'#/shareGoods?userID='+ JSON.parse(localStorage.getItem('userDesc')).user_id; `赠您【领取超值课程】特权，来唱唱和百万家庭一起快乐启蒙英语吧！`, //
this.onShare(URL); shareIcon: "https://cdn.singsingenglish.com/logo/logo.jpg",
this.lesson = JSON.parse(localStorage.getItem('lessonDetail')); shareUrl: URL
this.nowShow = 1; });
document.title =`${this.lesson.domTitle}`; },
backList() {
let lessonDetail = JSON.parse(localStorage.getItem("lessonDetail"));
let nowTime = Date.parse(new Date());
let lookTime = (nowTime - lessonDetail.nowTime) / 1000;
console.log(this.lesson);
this.$sa.track("watchClick", {
buttonName: "返回课程列表",
partName:
this.nowShow == 1
? "爸妈看一看"
: this.nowShow == 2
? "宝贝玩一玩"
: this.nowShow == 3
? "磨磨小耳朵"
: "",
elementID: this.lesson.id.toString(),
dayModule: this.lesson.domTitle.slice(0, 9),
weekName: this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
elementName:
this.lesson.domTitle.slice(0, 9) +
"-" +
this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
themeID: this.lesson.themeID,
themeName: this.lesson.themeName,
goodsID: this.lesson.goodsID,
classID: this.lesson.classID
});
let json = {
page_type: 0,
page_id: this.page_id,
stay_time: lookTime
};
subUserLessonApi(
this.elementId,
this.category_id,
this.periods_id,
json
).then(res => {
lessonDetail.total_watch_time = res.total_watch_time;
lessonDetail.nowTime = nowTime;
lessonDetail.star_num = res.total_star_num;
localStorage.setItem("lessonDetail", JSON.stringify(lessonDetail));
let query = {
periods_id: this.periods_id,
course_type: this.course_type,
parent_category_id: this.parent_category_id,
back_id: this.category_id
};
console.log(query);
// debugger
this.$router.push({ name: "map", query: query });
});
},
changeTitle(type) {
// if(type==type)
Toast.loading({
mask: true,
message: ""
});
this.nowShow = type;
let lessonDetail = JSON.parse(localStorage.getItem("lessonDetail"));
let nowTime = Date.parse(new Date());
let lookTime = (nowTime - lessonDetail.nowTime) / 1000;
let json = {
page_type: 0,
page_id: this.page_id,
stay_time: lookTime
};
console.log(lookTime);
subUserLessonApi(
this.elementId,
this.category_id,
this.periods_id,
json
).then(res => {
Toast.clear();
lessonDetail.total_watch_time = res.total_watch_time;
lessonDetail.nowTime = nowTime;
lessonDetail.star_num = res.total_star_num;
localStorage.setItem("lessonDetail", JSON.stringify(lessonDetail));
});
switch (type) {
case 1:
// 神策埋点 板块切换
this.$sa.track("learnPart", {
partName: "爸妈看一看",
elementID: this.lesson.id.toString(),
dayModule: this.lesson.domTitle.slice(0, 9),
weekName: this.lesson.domTitle.slice(
10,
this.lesson.domTitle.length
),
elementName:
this.lesson.domTitle.slice(0, 9) +
"-" +
this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
themeID: this.lesson.themeID,
themeName: this.lesson.themeName,
goodsID: this.lesson.goodsID,
classID: this.lesson.classID,
is_view_today:
!!new Date().setHours(0, 0, 0, 0) ===
new Date(this.lesson.push_time).setHours(0, 0, 0, 0)
});
this.page_id = 1;
this.nowLesson = { this.nowLesson = {
type:'text', type: "text",
partName:'爸妈看一看', title: 1,
title:1, partName: "爸妈看一看",
content:this.lesson.content.look, content: this.lesson.content.look,
age:this.nowLesson.age age: this.nowLesson.age
};
let json = {
page_type:0,
page_id:1,
stay_time:1,
}; };
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail')); // debugger
let nowTime = Date.parse(new Date()); break;
subUserLessonApi(this.elementId,this.category_id,this.periods_id,json).then(res=>{ case 2:
lessonDetail.total_watch_time = res.total_watch_time; // 神策埋点 板块切换
lessonDetail.nowTime = nowTime; this.$sa.track("learnPart", {
lessonDetail.star_num = res.total_star_num; partName: "宝贝玩一玩",
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail)); elementID: this.lesson.id.toString(),
Toast.clear() dayModule: this.lesson.domTitle.slice(0, 9),
weekName: this.lesson.domTitle.slice(
10,
this.lesson.domTitle.length
),
elementName:
this.lesson.domTitle.slice(0, 9) +
"-" +
this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
themeID: this.lesson.themeID,
themeName: this.lesson.themeName,
goodsID: this.lesson.goodsID,
classID: this.lesson.classID,
is_view_today:
!!new Date().setHours(0, 0, 0, 0) ===
new Date(this.lesson.push_time).setHours(0, 0, 0, 0)
}); });
this.$sa.track('learnPart',{ this.page_id = 2;
partName:'爸妈看一看', if (this.lesson.content.play.type) {
elementID:this.lesson.id.toString(), this.nowLesson = {
dayModule:this.lesson.domTitle.slice(0,9), type: "audio",
weekName:this.lesson.domTitle.slice(10,this.lesson.domTitle.length), title: 2,
elementName:this.lesson.domTitle.slice(0,9) + '-'+ this.lesson.domTitle.slice(10,this.lesson.domTitle.length), partName: "宝贝玩一玩",
themeID:this.lesson.themeID, content: this.lesson.content.play,
themeName:this.lesson.themeName, age: this.nowLesson.age
goodsID:this.lesson.goodsID, };
classID:this.lesson.classID, } else {
is_view_today:!!new Date().setHours(0, 0, 0, 0) === new Date(this.lesson.push_time).setHours(0, 0, 0, 0) this.nowLesson = {
type: "video",
title: 2,
partName: "宝贝玩一玩",
content: this.lesson.content.play,
age: this.nowLesson.age
};
}
break;
case 3:
this.$sa.track("learnPart", {
partName: "磨磨小耳朵",
elementID: this.lesson.id.toString(),
dayModule: this.lesson.domTitle.slice(0, 9),
weekName: this.lesson.domTitle.slice(
10,
this.lesson.domTitle.length
),
elementName:
this.lesson.domTitle.slice(0, 9) +
"-" +
this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
themeID: this.lesson.themeID,
themeName: this.lesson.themeName,
goodsID: this.lesson.goodsID,
classID: this.lesson.classID,
is_view_today:
!!new Date().setHours(0, 0, 0, 0) ===
new Date(this.lesson.push_time).setHours(0, 0, 0, 0)
}); });
if(this.lesson.content.play.video.length < 1 && this.lesson.content.play.audio.length < 1 ){ this.page_id = 5;
this.nowLesson.old=true if (this.lesson.content.fun.type) {
this.nowLesson = {
type: "audio",
title: 3,
partName: "磨磨小耳朵",
content: this.lesson.content.fun,
age: this.nowLesson.age
};
} else {
this.nowLesson = {
type: "video",
partName: "磨磨小耳朵",
title: 3,
content: this.lesson.content.fun,
age: this.nowLesson.age
};
} }
}) break;
} }
}, },
initPage() {
Toast.loading({
mask: true,
message: ""
});
console.log(this.$store.state.classQuery);
this.parent_category_id = this.$route.query.parent_category_id;
this.course_type = this.$route.query.course_type;
// debugger
getUserWatchApi().then(res => {
this.watchDetail = res;
this.$store.dispatch("setWatchDetail", this.watchDetail);
let URL =
process.env.API_URL +
"#/shareGoods?userID=" +
JSON.parse(localStorage.getItem("userDesc")).user_id;
this.onShare(URL);
this.lesson = JSON.parse(localStorage.getItem("lessonDetail"));
console.log(this.lesson);
this.nowShow = 1;
document.title = `${this.lesson.domTitle}`;
this.nowLesson = {
type: "text",
partName: "爸妈看一看",
title: 1,
content: this.lesson.content.look,
age: this.nowLesson.age
};
let json = {
page_type: 0,
page_id: 1,
stay_time: 1
};
let lessonDetail = JSON.parse(localStorage.getItem("lessonDetail"));
let nowTime = Date.parse(new Date());
subUserLessonApi(
this.elementId,
this.category_id,
this.periods_id,
json
).then(res => {
lessonDetail.total_watch_time = res.total_watch_time;
lessonDetail.nowTime = nowTime;
lessonDetail.star_num = res.total_star_num;
localStorage.setItem("lessonDetail", JSON.stringify(lessonDetail));
Toast.clear();
});
this.$sa.track("learnPart", {
partName: "爸妈看一看",
elementID: this.lesson.id.toString(),
dayModule: this.lesson.domTitle.slice(0, 9),
weekName: this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
elementName:
this.lesson.domTitle.slice(0, 9) +
"-" +
this.lesson.domTitle.slice(10, this.lesson.domTitle.length),
themeID: this.lesson.themeID,
themeName: this.lesson.themeName,
goodsID: this.lesson.goodsID,
classID: this.lesson.classID,
is_view_today:
!!new Date().setHours(0, 0, 0, 0) ===
new Date(this.lesson.push_time).setHours(0, 0, 0, 0)
});
if (
this.lesson.content.play.video.length < 1 &&
this.lesson.content.play.audio.length < 1
) {
this.nowLesson.old = true;
}
});
}
} }
};
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
@import "../../util/public"; @import "../../util/public";
.lessonHeader{background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/lessonHeader3.png?v=2') no-repeat;background-size:102*@toVw 334*@toVw;display: inline-block} .lessonHeader {
.header-h{display: none} background: url("https://static-cdn.changchangenglish.com/new-sing/static/images/lessonHeader3.png?v=2")
.home{height:46*@toVw;width:46*@toVw;background-position:0 0;} no-repeat;
.play{height:48*@toVw;width:102*@toVw;background-position:0 -46*@toVw;} background-size: 102 * @toVw 334 * @toVw;
.look{height:48*@toVw;width:102*@toVw;background-position:0 -94*@toVw;} display: inline-block;
.fun{height:48*@toVw;width:102*@toVw;background-position:0 -142*@toVw;} }
.defaultFun{height:48*@toVw;width:102*@toVw;background-position:0 -190*@toVw;} .header-h {
.defaultLook{height:48*@toVw;width:102*@toVw;background-position:0 -238*@toVw;} display: none;
.defaultPlay{height:48*@toVw;width:102*@toVw;background-position:0 -286*@toVw;} }
.header{ .home {
display: flex; height: 46 * @toVw;
display: -webkit-flex; width: 46 * @toVw;
position: absolute; background-position: 0 0;
top: 0; }
left: 0; .play {
width: 100%; height: 48 * @toVw;
padding: 5*@toVw 0; width: 102 * @toVw;
z-index: 2; background-position: 0 -46 * @toVw;
background:rgba(255,255,255,1); }
box-shadow:0*@toVw 2*@toVw 3*@toVw 0*@toVw rgba(0,0,0,0.1); .look {
} height: 48 * @toVw;
.newLesson{ width: 102 * @toVw;
background: #f8f8f8; background-position: 0 -94 * @toVw;
} }
.backImg{ .fun {
position: fixed; height: 48 * @toVw;
bottom: 40*@toVw; width: 102 * @toVw;
right: 20*@toVw; background-position: 0 -142 * @toVw;
z-index: 99999999; }
width: 60*@toVw; .defaultFun {
} height: 48 * @toVw;
width: 102 * @toVw;
background-position: 0 -190 * @toVw;
}
.defaultLook {
height: 48 * @toVw;
width: 102 * @toVw;
background-position: 0 -238 * @toVw;
}
.defaultPlay {
height: 48 * @toVw;
width: 102 * @toVw;
background-position: 0 -286 * @toVw;
}
.header {
display: flex;
display: -webkit-flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 5 * @toVw 0;
z-index: 2;
background: rgba(255, 255, 255, 1);
box-shadow: 0 * @toVw 2 * @toVw 3 * @toVw 0 * @toVw rgba(0, 0, 0, 0.1);
}
.newLesson {
background: #f8f8f8;
}
.backImg {
position: fixed;
bottom: 40 * @toVw;
right: 20 * @toVw;
z-index: 99999999;
width: 60 * @toVw;
}
@media screen and (orientation: landscape) { @media screen and (orientation: landscape) {
@toVw:100/667vw; @toVw: 100/667vw;
.backImg{ .backImg {
position: fixed; position: fixed;
bottom: 40*@toVw; bottom: 40 * @toVw;
right: 20*@toVw; right: 20 * @toVw;
z-index: 99999999; z-index: 99999999;
width: 60*@toVw; width: 60 * @toVw;
} }
.lessonHeader{ .lessonHeader {
display: none; display: none;
} }
.header{ .header {
display: none; display: none;
} }
.actBanKuai{ .actBanKuai {
background-color: white; background-color: white;
border: 1*@toVw solid transparent; border: 1 * @toVw solid transparent;
border-left-color: black; border-left-color: black;
border-top-color: black; border-top-color: black;
border-bottom-color: black; border-bottom-color: black;
border-radius: 8*@toVw 0 0 8*@toVw; border-radius: 8 * @toVw 0 0 8 * @toVw;
}
.headerHP {
background-size: 62 * @toVw 434 * @toVw;
display: inline-block;
}
.home {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 0;
}
.lookHP {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -62 * @toVw;
.actBanKuai;
}
.playHP {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -124 * @toVw;
.actBanKuai;
}
.funHP {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -186 * @toVw;
.actBanKuai;
} }
.headerHP{background-size:62*@toVw 434*@toVw;display: inline-block} .defaultFun {
.home{height:62*@toVw;width:62*@toVw;background-position:0 0;} height: 62 * @toVw;
.lookHP{height:62*@toVw;width:62*@toVw;background-position:0 -62*@toVw;.actBanKuai} width: 62 * @toVw;
.playHP{height:62*@toVw;width:62*@toVw;background-position:0 -124*@toVw;.actBanKuai} background-position: 0 -248 * @toVw;
.funHP{height:62*@toVw;width:62*@toVw;background-position:0 -186*@toVw;.actBanKuai} }
.defaultFun{height:62*@toVw;width:62*@toVw;background-position:0 -248*@toVw;} .defaultLook {
.defaultLook{height:62*@toVw;width:62*@toVw;background-position:0 -310*@toVw;} height: 62 * @toVw;
.defaultPlay{height:62*@toVw;width:62*@toVw;background-position:0 -372*@toVw;} width: 62 * @toVw;
.header-h{ background-position: 0 -310 * @toVw;
}
.defaultPlay {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -372 * @toVw;
}
.header-h {
display: block; display: block;
width: 62*@toVw; width: 62 * @toVw;
position: absolute; position: absolute;
left: 17.5*@toVw; left: 17.5 * @toVw;
top: 20*@toVw; top: 20 * @toVw;
z-index: 2; z-index: 2;
.headerHP{ .headerHP {
display: block; display: block;
img{width:42*@toVw;margin-left: 10*@toVw;margin-top: 5*@toVw; } img {
width: 42 * @toVw;
margin-left: 10 * @toVw;
margin-top: 5 * @toVw;
}
} }
} }
.index-content-block{ .index-content-block {
position: absolute; position: absolute;
top: 20*@toVw; top: 20 * @toVw;
left: 80*@toVw; left: 80 * @toVw;
right: 20*@toVw; right: 20 * @toVw;
bottom: 20*@toVw; bottom: 20 * @toVw;
background: white; background: white;
border: 1*@toVw solid #000; border: 1 * @toVw solid #000;
border-radius: 0 8*@toVw 8*@toVw 8*@toVw; border-radius: 0 8 * @toVw 8 * @toVw 8 * @toVw;
&.radius{ &.radius {
border-radius: 8*@toVw; border-radius: 8 * @toVw;
} }
} }
} }
@media screen and (min-aspect-ratio: ~"20/8"){ @media screen and (min-aspect-ratio: ~"20/8") {
@toVw:100/900vw; @toVw: 100/900vw;
.backImg{ .backImg {
position: fixed; position: fixed;
bottom: 40*@toVw; bottom: 40 * @toVw;
right: 20*@toVw; right: 20 * @toVw;
z-index: 99999999; z-index: 99999999;
width: 60*@toVw; width: 60 * @toVw;
} }
.lessonHeader{ .lessonHeader {
display: none; display: none;
} }
.header{ .header {
display: none; display: none;
} }
.actBanKuai{ .actBanKuai {
background-color: white; background-color: white;
border: 1*@toVw solid transparent; border: 1 * @toVw solid transparent;
border-left-color: black; border-left-color: black;
border-top-color: black; border-top-color: black;
border-bottom-color: black; border-bottom-color: black;
border-radius: 8*@toVw 0 0 8*@toVw; border-radius: 8 * @toVw 0 0 8 * @toVw;
} }
.headerHP{ .headerHP {
// background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index-h.png?v=2') no-repeat; // background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index-h.png?v=2') no-repeat;
background-size:62*@toVw 434*@toVw; background-size: 62 * @toVw 434 * @toVw;
display: inline-block; display: inline-block;
&.lookHP{height:62*@toVw;width:62*@toVw;background-position:0 0;.actBanKuai} &.lookHP {
&.defaultPlay{height:62*@toVw;width:62*@toVw;background-position:0 -62*@toVw;} height: 62 * @toVw;
&.playHP{height:62*@toVw;width:62*@toVw;background-position:0 -124*@toVw;.actBanKuai} width: 62 * @toVw;
&.defaultLook{height:62*@toVw;width:62*@toVw;background-position:0 -186*@toVw;} background-position: 0 0;
&.home{height:62*@toVw;width:62*@toVw;background-position:0 -248*@toVw;} .actBanKuai;
&.defaultFun{height:62*@toVw;width:62*@toVw;background-position:0 -310*@toVw;} }
&.funHP{height:62*@toVw;width:62*@toVw;background-position:0 -372*@toVw;.actBanKuai} &.defaultPlay {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -62 * @toVw;
}
&.playHP {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -124 * @toVw;
.actBanKuai;
}
&.defaultLook {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -186 * @toVw;
}
&.home {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -248 * @toVw;
}
&.defaultFun {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -310 * @toVw;
}
&.funHP {
height: 62 * @toVw;
width: 62 * @toVw;
background-position: 0 -372 * @toVw;
.actBanKuai;
}
} }
.header-h{ .header-h {
display: block; display: block;
width: 62*@toVw; width: 62 * @toVw;
position: absolute; position: absolute;
left: 17.5*@toVw; left: 17.5 * @toVw;
top: 20*@toVw; top: 20 * @toVw;
z-index: 2; z-index: 2;
.headerHP{ .headerHP {
display: block; display: block;
img{width:42*@toVw;margin-left: 10*@toVw;margin-top: 5*@toVw; } img {
width: 42 * @toVw;
margin-left: 10 * @toVw;
margin-top: 5 * @toVw;
}
} }
} }
.index-content-block{ .index-content-block {
position: absolute; position: absolute;
top: 20*@toVw; top: 20 * @toVw;
left: 80*@toVw; left: 80 * @toVw;
right: 20*@toVw; right: 20 * @toVw;
bottom: 20*@toVw; bottom: 20 * @toVw;
background: white; background: white;
border: 1*@toVw solid #000; border: 1 * @toVw solid #000;
border-radius: 0 8*@toVw 8*@toVw 8*@toVw; border-radius: 0 8 * @toVw 8 * @toVw 8 * @toVw;
&.radius{ &.radius {
border-radius: 8*@toVw; border-radius: 8 * @toVw;
} }
} }
} }
......
src/components/newLesson/shareGoods - 副本.vue deleted 100644 → 0
View file @ 244ae216
<template>
<div>
<div class="share-good-page" ref="share_page">
<div class="share-good-head" v-if="userDetail" >
<img :src="shareGoodsBg" alt="">
<img class="head" :src="userDetail.user_info.avatar">
<div class="tip2"><p v-if="nickname">{{userDetail.user_info.nickname}}家宝宝</p><p>在「唱唱启蒙英语」累计学习</p></div>
<!-- <div class="title" :style="{backgroundImage:`url('${title_share_goods}')`}" >
{{userDetail.user_info.nickname}}
</div> -->
<div class="day">
{{userDetail.total_day}}
<p>
Days
</p>
</div>
<div class="textBox">
<!-- <p class="top">继续坚持</p> -->
<p class="btn">学无涯 行必知</p>
</div>
<!-- <div class="iknow" v-if="goodsDetail.current_price!=0" @click="toBuy(1)">
<img :src="btncoin" alt="">
</div>
<div class="iknow" v-if="goodsDetail.current_price==0" @click="toBuy(3)">
<img :src="btnfree" alt="">
</div> -->
<div class="Fml"><p>邀您一起带宝宝学习</p> <div>「<span>100万+</span>家庭推荐的哈佛英语启蒙课」</div>
<div class="line"></div>
</div>
<div class="nav" @click="move" v-if="goodsDetail">
<img class="move" :src="icon_point" alt="">
课程详情
<img class="move" :src="icon_point" alt="">
</div>
</div>
<div class="good-content" v-if="goodsDetail&&goodsDetail.desc&&goodsDetail.desc.detail">
<div class="content" v-html="goodsDetail.desc.detail">
</div>
<div class="btn-block" ref="btn_block">
<div class="lastTime">
距优惠结束仅剩 {{lastTime.day}} 天 {{lastTime.hour}} 时 {{lastTime.min}} 分 {{lastTime.second}} 秒
</div>
<div class="btn" @click="toBuy(2)" v-if="goodsDetail.current_price>100">
正在疯抢 · 超值VIP课程
</div>
<div class="btn" @click="toBuy(2)" v-if="goodsDetail.current_price==100">
1元领取 · 超值VIP课程
</div>
</div>
</div>
<!-- <div class="good-content" v-if="goodsDetail&&goodsDetail.goods_type==2">
<div class="content" v-html="goodsDetail.desc.detail">
</div>
<div class="btn-block" ref="btn_block">
<div class="lastTime">
优惠倒计时 {{lastTime.day}} 天 {{lastTime.hour}} 时 {{lastTime.min}} 分 {{lastTime.second}} 秒
</div>
<div class="btnBox">
<div class="btn slg" @click="toBuy(1)">
单独购&nbsp;&nbsp;￥{{goodsDetail.original_price/100}}
</div>
<div class="btn grp" @click="toBuy(3)">
{{goodsDetail.desc.group_number}}人团&nbsp;&nbsp;￥{{goodsDetail.current_price/100}}
</div>
</div>
</div>
</div> -->
</div>
<login-page v-if="goodsDetail" :bind-mobile="bindMobile" :groupDetail="goodsDetail" @goToBuyPage="goToBuyPage"></login-page>
</div>
</template>
<script>
import shareGoodsBg from '../../assets/newLesson/shareGoodsBg5.png'
import title_share_goods from '../../assets/newLesson/title-share-goods.png'
import btncoin from '../../assets/newLesson/btncoin.png'
import btnfree from '../../assets/newLesson/btnfree.png'
import icon_point from '../../assets/newLesson/icon_point@2x.png'
import {getOtherUserWatchApi,getShareGoodsApi} from "../../service/api";
import loginPage from '../buy/login'
import {Toast} from 'vant'
export default {
name: "shareGoods",
components: {loginPage},
data(){
return {
shareGoodsBg:shareGoodsBg,
title_share_goods:title_share_goods,
userDetail:null,
bindMobile:{
show:false,
mobile:'',
img_code:'',
verify_code:''
},
btncoin:btncoin,
btnfree:btnfree,
icon_point:icon_point,
shopId:null,
goodsDetail:null,
lastTime:localStorage.getItem('lastTimeShare')?JSON.parse(localStorage.getItem('lastTimeShare')):{day:0,hour:8,min:0,second:0},
nickname:""
}
},
methods:{
move(){
let moneyDom = document.getElementsByClassName('nav');
if(moneyDom.length>0){
console.log(moneyDom[0].offsetTop)
window.scrollTo(0,moneyDom[0].offsetTop);
}
// window.scrollTo(100,1200)
},
lastTimeOut(){
if(this.lastTime.second === 0 ){
this.lastTime.second = 59;
if(this.lastTime.min === 0 ){
this.lastTime.min = 59;
if(this.lastTime.hour === 0 ){
this.lastTime.hour = 8;
}else{
this.lastTime.hour--;
}
}else{
this.lastTime.min--;
}
}else{
this.lastTime.second--;
}
localStorage.setItem('lastTimeShare',JSON.stringify(this.lastTime))
},
initPage(){
Toast.loading({
mask: true,
message: ''
});
this.$sa.track('ViewInvitation',{
salesID:this.$route.query.userID,
});
console.log(JSON.parse(localStorage.getItem('userDesc')))
this.nickname = JSON.parse(localStorage.getItem('userDesc')).nickname
getOtherUserWatchApi(this.$route.query.userID).then(res=>{
res.user_info.avatar = res.user_info.avatar.replace('http://','https://');
this.userDetail = res
this.nickname= res.user_info.nickname
});
// this.shopId
getShareGoodsApi().then(res=>{
this.shopId = res.id;
res.desc = JSON.parse(res.desc)
res.goods_desc = JSON.parse(res.goods_desc);
this.goodsDetail = res
console.log(res)
setTimeout(() => {
this.goodsDetail = {}
this.goodsDetail = res
Toast.clear()
}, 500);
// debugger
// getGoodsDetailApi(this.shopId).then(res=>{
// res.desc = JSON.parse(res.desc)
// res.goods_desc = JSON.parse(res.goods_desc);
// this.goodsDetail = res
// })
})
},
goToBuyPage(type){
if(type==1){
window.location.href = `${process.env.API_URL}#/buy?shopId=${this.shopId}&type=single&invite_code=CC-UDK-${this.$route.query.userID}`
}else{
window.location.href = `${process.env.API_URL}#/buy?shopId=${this.shopId}&invite_code=CC-UDK-${this.$route.query.userID}`
}
},
toBuy(type){
if(this.goodsDetail.current_price==100){
this.$sa.track('buttonClick',{
tabTitle:'打卡商品页',
moduleTitle:'功能按钮',
buttonType:'购买',
buttonName:'1元领取 · 超值VIP课程'
});
}else{
this.$sa.track('buttonClick',{
tabTitle:'打卡商品页',
moduleTitle:'功能按钮',
buttonType:'购买',
buttonName:'正在疯抢.超值VIP课程'
});
}
if(!JSON.parse(localStorage.getItem('userDesc')).mobile|| JSON.parse(localStorage.getItem('userDesc')).mobile === ''){
this.bindMobile.show = true;
setTimeout(()=>{
this.$sa.track('ViewRegisterpage',{});
},1000)
}else{
this.goToBuyPage(type);
}
}
},
mounted(){
let that = this
this.initPage();
setInterval(()=>{this.lastTimeOut(
)},1000);
window.onscroll= ()=>{
//变量t是滚动条滚动时，距离顶部的距离
let t = document.documentElement.scrollTop||document.body.scrollTop;
if( this.$refs.btn_block){
if(t>500){
this.$refs.btn_block.style.opacity = 1
}else{
this.$refs.btn_block.style.opacity = 0
}
}
}
}
}
</script>
<style scoped lang="less">
@import "../../util/public";
@-webkit-keyframes spin {
from {
-webkit-transform: translateY(-3*@toVw);
}
to {
-webkit-transform: translateY(3*@toVw);
}
}
@keyframes spin {
from {
transform: translateY(-3*@toVw);
}
to {
transform: translateY(3*@toVw);
}
}
.move{-webkit-animation: spin 2s linear 1s 5 alternate;animation: spin 2s linear infinite;}
.share-good-page{
// position: absolute;
// top: 0;
// left: 0;
// right: 0;
// bottom: 0;
overflow: auto;
&::-webkit-scrollbar {
display: none;
}
}
.share-good-head{
width: 100vw;
// height: 584*@toVw;
// margin-top: -64*@toVw;
// background-size: 100% 100%;
position: relative;
.textBox{position: absolute;top: 265*@toVw;left:142*@toVw ;text-align: center;color: #746D6E; font-size: 15*@toVw;
.top{ font-size: 17*@toVw;}
.btn{ font-size: 15*@toVw;}
}
.iknow{
position: absolute;
top: 415*@toVw;
width: 265*@toVw;
// height: 44*@toVw;
left: 58*@toVw;
}
.head{
position: absolute;
width: 60*@toVw;
height: 60*@toVw;
top: 42*@toVw;
left: 159*@toVw;
border-radius: 100*@toVw;
}
.tip2{
position: absolute;
width: 350*@toVw;
color: #746D6E;
font-size: 15*@toVw;
text-align: center;
top: 110*@toVw;
left: 13*@toVw;
}
.title{
position: absolute;
width: 225*@toVw;
height: 54*@toVw;
background-size: 100% 100%;
top: 175*@toVw;
left: 75*@toVw;
text-align: center;
color: white;
font-size: 20*@toVw;
line-height: 48*@toVw;
}
.day{
position: absolute;
top: 176*@toVw;
width: 100%;
text-align: center;
color: white;
font-size:40*@toVw;
font-family:PingFangSC-Semibold;
font-weight:bold;
p{
font-size:15*@toVw;
font-family:PingFangSC-Semibold;
// font-weight:bold;
line-height: 16*@toVw;
font-weight:300;
color:white;
}
}
.Fml{position: absolute;top:314*@toVw;left:56*@toVw;font-size: 15*@toVw;color: #55343A;
text-align: center;
p{line-height: 36*@toVw;color: #55343A;}
div{color: #6A3028;font-weight: bold; }
.line{width: 95%;height: 4*@toVw;background: #F6C9A2;opacity: 0.44;position: relative;top: -5*@toVw;}
span{color: #E17640;}
}
.nav{position: absolute;top:412*@toVw;left: 108*@toVw;
img{width: 10*@toVw;}
width: 157*@toVw;height: 30*@toVw;
line-height: 30*@toVw;
border-radius: 15*@toVw;
background: #F98F55;
text-align: center;
color: white;}
}
.good-content{
background: #F4CAA2;
padding: 0 15*@toVw 80*@toVw 15*@toVw;
position: relative;
top: -5*@toVw;
.content{
// background: white;
border-radius: 8*@toVw;
overflow: hidden;
// padding: 10*@toVw;
};
}
.btn-block{
position: fixed;
padding: 10*@toVw 0 ;
left: 0;
width: 100%;
background: white;
opacity: 0;
transition: all 0.5s;
bottom: 0;
.lastTime{
top: -30*@toVw;
height: 30*@toVw;
line-height: 30*@toVw;
color: #FF785D;
background: #FFE543;
position: absolute;
text-align: center;
left: 0;
width: 100%;
}
.btnBox{
display: flex;
padding:0 29*@toVw;
.slg{background: white;color: #666666;border: 1px solid #666666;box-sizing: border-box;margin-right: 10*@toVw;}
}
.btn{
width: 287*@toVw;
height: 44*@toVw;
margin: auto;
background: #FF785D;
border-radius: 100*@toVw;
color: white;
line-height: 44*@toVw;
text-align: center;
font-size:18*@toVw;
font-family:PingFang-SC-Medium;
font-weight:500;
}
}
</style>
<style>
img{
max-width: 100% !important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment