Commit 5e0a77ec authored by wangwei's avatar wangwei

神策埋点

parent d6c6d172
...@@ -295,12 +295,10 @@ ...@@ -295,12 +295,10 @@
}, },
// 进入课程 // 进入课程
goDetail(){ goDetail(){
// 神策埋点 选择课时 // 神策埋点 选择课时
this.$sa.track('StartCourse',{ this.$sa.track('StartCourse',{
elementID:this.thisLesson.id.toString(), elementID:this.thisLesson.id.toString(),
is_view_today:'' is_view_today:!!new Date().setHours(0, 0, 0, 0) === new Date(this.push_time).setHours(0, 0, 0, 0)
}); });
if(this.thisLesson.content.tips){ if(this.thisLesson.content.tips){
let query = { let query = {
...@@ -310,7 +308,9 @@ ...@@ -310,7 +308,9 @@
course_type:this.$route.query.course_type, course_type:this.$route.query.course_type,
parent_category_id:this.parent_category_id, parent_category_id:this.parent_category_id,
}; };
localStorage.setItem('lessonDetail',JSON.stringify(this.thisLesson)); let lessonData = JSON.parse(JSON.stringify(this.thisLesson));
lessonData.push_time = this.push_time;
localStorage.setItem('lessonDetail',JSON.stringify(lessonData));
this.$router.push({name:'newLesson',query:query}) this.$router.push({name:'newLesson',query:query})
}else{ }else{
let query = { let query = {
...@@ -321,7 +321,7 @@ ...@@ -321,7 +321,7 @@
course_type:this.$route.query.course_type, course_type:this.$route.query.course_type,
type:'1' type:'1'
}; };
// this.$router.push({name:'lesson',query:query}) this.$router.push({name:'lesson',query:query})
} }
}, },
// 切换主题 // 切换主题
......
...@@ -35,12 +35,12 @@ ...@@ -35,12 +35,12 @@
</div> </div>
</div> </div>
<div class="btn-group"> <div class="btn-group">
<i class="playImage toBig" @click="imgPop=true"></i> <i class="playImage toBig" @click="imgPop=true;sendConsole('放大图片')"></i>
<i class="playImage list" @click="popupVisible=!popupVisible"></i> <i class="playImage list" @click="popupVisible=!popupVisible;sendConsole('展开列表')"></i>
<i class="playImage last" @click="lastOne()"></i> <i class="playImage last" @click="lastOne()"></i>
<i class="playImage play" v-if="!playFlag" @click="onPlay"></i> <i class="playImage play" v-if="!playFlag" @click="onPlay(true)"></i>
<i class="playImage stop" v-if="playFlag" @click="onStop"></i> <i class="playImage stop" v-if="playFlag" @click="onStop(true)"></i>
<i class="playImage next" @click="nextOne()"></i> <i class="playImage next" @click="nextOne(true)"></i>
<i :class="{playImage:true,replay:playType===1,replayAll:playType===0,listPlay:playType==2}" @click="changeType()"></i> <i :class="{playImage:true,replay:playType===1,replayAll:playType===0,listPlay:playType==2}" @click="changeType()"></i>
<i :class="{playImage:true,collectDefault:!hasCollect,collect:!!hasCollect}" @click="changeCollect"></i> <i :class="{playImage:true,collectDefault:!hasCollect,collect:!!hasCollect}" @click="changeCollect"></i>
</div> </div>
...@@ -50,16 +50,16 @@ ...@@ -50,16 +50,16 @@
<div v-if="contentData.age === 2">4-6岁<i class="playImage _154722344142123489"></i></div> <div v-if="contentData.age === 2">4-6岁<i class="playImage _154722344142123489"></i></div>
</div> </div>
<div class="age-change-block" v-show="ageShow" v-if="contentData.content.age"> <div class="age-change-block" v-show="ageShow" v-if="contentData.content.age">
<div @click="contentData.age = 1">0-3岁<i class="playImage _282918034425091245" v-if="contentData.age === 1"></i></div> <div @click="contentData.age = 1;sendConsole('选择分龄')">0-3岁<i class="playImage _282918034425091245" v-if="contentData.age === 1"></i></div>
<div @click="contentData.age = 2">4-6岁<i class="playImage _282918034425091245" v-if="contentData.age === 2"></i></div> <div @click="contentData.age = 2;sendConsole('选择分龄')">4-6岁<i class="playImage _282918034425091245" v-if="contentData.age === 2"></i></div>
</div> </div>
<div v-if="showObj.change" class="change-block-HP" @click="contentData.type = 'video'"> <div v-if="showObj.change" class="change-block-HP" @click="contentData.type = 'video';sendConsole('切换视频教学')">
<div class=""> <div class="">
<img :src="tapToVideo"/> <img :src="tapToVideo"/>
</div> </div>
</div> </div>
<div v-if="showObj.change" class="change-block"> <div v-if="showObj.change" class="change-block">
<div @click="contentData.type = 'video'">视频教学</div> <div @click="contentData.type = 'video';sendConsole('切换视频教学')">视频教学</div>
<div class="active" >音频教学</div> <div class="active" >音频教学</div>
</div> </div>
</div> </div>
...@@ -68,7 +68,7 @@ ...@@ -68,7 +68,7 @@
v-model="popupVisible" v-model="popupVisible"
position="bottom" style="background: transparent"> position="bottom" style="background: transparent">
<div class="list-popup" v-if="showObj.audio"> <div class="list-popup" v-if="showObj.audio">
<div :class="{'list-block':true,active:i=== index}" v-for="(data,i) in this.showObj.audio" @click="changeIndex(i)"> <div :class="{'list-block':true,active:i=== index}" v-for="(data,i) in this.showObj.audio" @click="changeIndex(i);sendConsole('列表选择音频')">
{{data.title}} {{data.title}}
<i :class="{playImage:true,zDefaultIcon:i !== index,zIcon:i === index}"></i> <i :class="{playImage:true,zDefaultIcon:i !== index,zIcon:i === index}"></i>
</div> </div>
...@@ -128,15 +128,34 @@ ...@@ -128,15 +128,34 @@
this.checkCollect(); this.checkCollect();
}, },
methods:{ methods:{
sendConsole(data){
this.$sa.track('watchClick',{
buttonName:data,
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
},
// 改变收藏状态 // 改变收藏状态
changeCollect(){ changeCollect(){
if(this.hasCollect){ if(this.hasCollect){
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'取消收藏',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
delUserCollectApi(this.hasCollect).then(res=>{ delUserCollectApi(this.hasCollect).then(res=>{
this.hasCollect = false; this.hasCollect = false;
Toast('取消收藏'); Toast('取消收藏');
this.checkCollect() this.checkCollect()
}) })
}else{ }else{
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'添加收藏',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail')); let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail'));
let json = { let json = {
category_id:lessonDetail.id, category_id:lessonDetail.id,
...@@ -162,10 +181,23 @@ ...@@ -162,10 +181,23 @@
}) })
}, },
// 播放音频 // 播放音频
onPlay(){ onPlay(flag){
if(flag){
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'播放音频',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
}
this.$refs.audio.play(); this.$refs.audio.play();
}, },
lastOne(){ lastOne(){
this.$sa.track('watchClick',{
buttonName:'上一首',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
if(this.index > 0){ if(this.index > 0){
this.index --; this.index --;
this.keepPlay() this.keepPlay()
...@@ -193,7 +225,15 @@ ...@@ -193,7 +225,15 @@
}) })
} }
}, },
nextOne(){ nextOne(flag){
if(flag){
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'下一首',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
}
if(this.index < this.showObj.audio.length-1){ if(this.index < this.showObj.audio.length-1){
this.index ++; this.index ++;
this.keepPlay() this.keepPlay()
...@@ -261,7 +301,15 @@ ...@@ -261,7 +301,15 @@
}, },
// 播放暂停 // 播放暂停
onStop(){ onStop(flag){
if(flag){
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'暂停播放',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
}
this.$refs.audio.pause(); this.$refs.audio.pause();
this.playFlag = false this.playFlag = false
}, },
...@@ -304,12 +352,30 @@ ...@@ -304,12 +352,30 @@
window.localStorage.setItem('playType',this.playType); window.localStorage.setItem('playType',this.playType);
switch (this.playType) { switch (this.playType) {
case 1: case 1:
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'单曲循环',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
Toast('单曲循环'); Toast('单曲循环');
break; break;
case 2: case 2:
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'顺序播放',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
Toast('顺序播放'); Toast('顺序播放');
break; break;
case 0: case 0:
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'列表循环',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
Toast('列表循环'); Toast('列表循环');
break break
} }
......
...@@ -65,6 +65,12 @@ ...@@ -65,6 +65,12 @@
}, },
methods:{ methods:{
backList(){ backList(){
// 神策埋点 按钮点击
this.$sa.track('learnPart',{
buttonName:'返回课程列表',
partName:this.nowShow == 1 ? '爸妈看一看' : this.nowShow == 2 ? '宝贝玩一玩' : this.nowShow == 3 ? '磨磨小耳朵' : '',
elementID:this.lesson.id.toString(),
});
let json = { let json = {
page_type:0, page_type:0,
page_id:this.page_id, page_id:this.page_id,
...@@ -93,40 +99,62 @@ ...@@ -93,40 +99,62 @@
}); });
switch (type) { switch (type) {
case 1: case 1:
json.page_id = 1; // 神策埋点 板块切换
this.$sa.track('learnPart',{
partName:'爸妈看一看',
elementID:this.lesson.id.toString(),
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:'爸妈看一看',
content:this.lesson.content.look, content:this.lesson.content.look,
age:this.nowLesson.age age:this.nowLesson.age
}; };
break; break;
case 2: case 2:
json.page_id = 2; // 神策埋点 板块切换
this.$sa.track('learnPart',{
partName:'宝贝玩一玩',
elementID:this.lesson.id.toString(),
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){ if(this.lesson.content.play.type){
this.nowLesson = { this.nowLesson = {
type:'audio', type:'audio',
partName:'宝贝玩一玩',
content:this.lesson.content.play, content:this.lesson.content.play,
age:this.nowLesson.age age:this.nowLesson.age
}; };
}else{ }else{
this.nowLesson = { this.nowLesson = {
type:'video', type:'video',
partName:'宝贝玩一玩',
content:this.lesson.content.play, content:this.lesson.content.play,
age:this.nowLesson.age age:this.nowLesson.age
}; };
} }
break; break;
case 3: case 3:
json.page_id = 5; this.$sa.track('learnPart',{
partName:'磨磨小耳朵',
elementID:this.lesson.id.toString(),
is_view_today:!!new Date().setHours(0, 0, 0, 0) === new Date(this.lesson.push_time).setHours(0, 0, 0, 0)
});
this.page_id = 5;
if(this.lesson.content.fun.type){ if(this.lesson.content.fun.type){
this.nowLesson = { this.nowLesson = {
type:'audio', type:'audio',
partName:'磨磨小耳朵',
content:this.lesson.content.fun, content:this.lesson.content.fun,
age:this.nowLesson.age age:this.nowLesson.age
}; };
}else{ }else{
this.nowLesson = { this.nowLesson = {
type:'video', type:'video',
partName:'磨磨小耳朵',
content:this.lesson.content.fun, content:this.lesson.content.fun,
age:this.nowLesson.age age:this.nowLesson.age
}; };
......
...@@ -115,7 +115,7 @@ ...@@ -115,7 +115,7 @@
margin-top: 20px; margin-top: 20px;
box-sizing: border-box; box-sizing: border-box;
} }
.look-content img,video{ .look-content img,video,audio{
max-width: 100%; max-width: 100%;
} }
@font-face{font-family:hanti;src:url(https://cdn.singsingenglish.com/template/SentyZHAO.ttf)} @font-face{font-family:hanti;src:url(https://cdn.singsingenglish.com/template/SentyZHAO.ttf)}
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<img :src="imgURL.luolalaila" class="text" v-if="nowShow === 2"> <img :src="imgURL.luolalaila" class="text" v-if="nowShow === 2">
</div> </div>
<div class="video-block hp-video" v-if="showObj.video[videoIndex]"> <div class="video-block hp-video" v-if="showObj.video[videoIndex]">
<video :src="showObj.video[videoIndex].url" @ended="videoEnd" controls :poster="showObj.video[videoIndex].url+'?vframe/jpg/offset/3'"></video> <video :src="showObj.video[videoIndex].url" @ended="videoEnd" @play="videoPlay()" controls :poster="showObj.video[videoIndex].url+'?vframe/jpg/offset/3'"></video>
</div> </div>
<div class="btn-block"> <div class="btn-block">
<div v-if="contentData.content.age" class="age-block" @click="ageShow = !ageShow"> <div v-if="contentData.content.age" class="age-block" @click="ageShow = !ageShow">
...@@ -20,17 +20,17 @@ ...@@ -20,17 +20,17 @@
<div @click="videoIndex= index;videoShow=false" v-for="(item,index) in showObj.video">视频({{index+1}})<i :class="{'playImage _282918034425091245':index === videoIndex}" v-if="contentData.age === 1"></i></div> <div @click="videoIndex= index;videoShow=false" v-for="(item,index) in showObj.video">视频({{index+1}})<i :class="{'playImage _282918034425091245':index === videoIndex}" v-if="contentData.age === 1"></i></div>
</div> </div>
<div class="age-change-block" v-show="ageShow" v-if="contentData.content.age && ageShow"> <div class="age-change-block" v-show="ageShow" v-if="contentData.content.age && ageShow">
<div @click="contentData.age = 1;ageShow=false">0-3岁<i class="playImage _282918034425091245" v-if="contentData.age === 1"></i></div> <div @click="contentData.age = 1;ageShow=false;sendConsole('选择分龄')">0-3岁<i class="playImage _282918034425091245" v-if="contentData.age === 1"></i></div>
<div @click="contentData.age = 2;ageShow=false">4-6岁<i class="playImage _282918034425091245" v-if="contentData.age === 2"></i></div> <div @click="contentData.age = 2;ageShow=false;sendConsole('选择分龄')">4-6岁<i class="playImage _282918034425091245" v-if="contentData.age === 2"></i></div>
</div> </div>
<div v-if="showObj.change" class="change-block-HP" @click="changeAudio()"> <div v-if="showObj.change" class="change-block-HP" @click="changeAudio(true)">
<div class=""> <div class="">
<img :src="imgURL.tapToAudio"/> <img :src="imgURL.tapToAudio"/>
</div> </div>
</div> </div>
<div v-if="showObj.change" class="change-block"> <div v-if="showObj.change" class="change-block">
<div class="active">视频教学</div> <div class="active">视频教学</div>
<div @click="changeAudio()">音频教学</div> <div @click="changeAudio(true)">音频教学</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -75,9 +75,31 @@ ...@@ -75,9 +75,31 @@
videoEnd(event){ videoEnd(event){
event.srcElement.play() event.srcElement.play()
}, },
changeAudio(){ sendConsole(data){
this.$sa.track('watchClick',{
buttonName:data,
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
},
changeAudio(flag){
if(flag){
this.$sa.track('watchClick',{
buttonName:'切换音频教学',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
}
this.contentData.type = 'audio' this.contentData.type = 'audio'
}, },
videoPlay(){
// 神策埋点 点击操作
this.$sa.track('watchClick',{
buttonName:'播放视频',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
},
changeAge(value){ changeAge(value){
if(this.contentData.content.age && value === 2){ if(this.contentData.content.age && value === 2){
this.showObj = { this.showObj = {
......
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