730

parent 7f117f35
......@@ -11,4 +11,4 @@
position: fixed;
background: #f4f4f4;
}
/* html{font-size: 1px;} */</style><link href=static/css/app.91d2eea1dfca80994de99748f577fac4.css rel=stylesheet></head><body><div id=app></div><script src=https://res.wx.qq.com/open/js/jweixin-1.3.2.js></script><script></script><script type=text/javascript src=static/js/manifest.bfba8cfe3abc80459324.js></script><script type=text/javascript src=static/js/vendor.f35ede72f5c3508f6b05.js></script><script type=text/javascript src=static/js/app.04c615a913e40c6ef41e.js></script></body></html>
\ No newline at end of file
/* html{font-size: 1px;} */</style><link href=static/css/app.91d2eea1dfca80994de99748f577fac4.css rel=stylesheet></head><body><div id=app></div><script src=https://res.wx.qq.com/open/js/jweixin-1.3.2.js></script><script></script><script type=text/javascript src=static/js/manifest.56b649bcc894988e6b7f.js></script><script type=text/javascript src=static/js/vendor.5d7f312b4e27ca12aa18.js></script><script type=text/javascript src=static/js/app.5b6fbc04b08dc830f260.js></script></body></html>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
!function(e){var c=window.webpackJsonp;window.webpackJsonp=function(a,d,n){for(var r,t,o,i=0,u=[];i<a.length;i++)t=a[i],f[t]&&u.push(f[t][0]),f[t]=0;for(r in d)Object.prototype.hasOwnProperty.call(d,r)&&(e[r]=d[r]);for(c&&c(a,d,n);u.length;)u.shift()();if(n)for(i=0;i<n.length;i++)o=b(b.s=n[i]);return o};var a={},f={54:0};function b(c){if(a[c])return a[c].exports;var f=a[c]={i:c,l:!1,exports:{}};return e[c].call(f.exports,f,f.exports,b),f.l=!0,f.exports}b.e=function(e){var c=f[e];if(0===c)return new Promise(function(e){e()});if(c)return c[2];var a=new Promise(function(a,b){c=f[e]=[a,b]});c[2]=a;var d=document.getElementsByTagName("head")[0],n=document.createElement("script");n.type="text/javascript",n.charset="utf-8",n.async=!0,n.timeout=12e4,b.nc&&n.setAttribute("nonce",b.nc),n.src=b.p+"static/js/"+({0:"vendor-async"}[e]||e)+"."+{0:"1aad2168fb530f5aa4a7",1:"ce466f9e61b92a03cbf3",2:"5c59114175b6cd23c39c",3:"58a01dba059857bfcdc0",4:"dfaade6e76c72d90bc8a",5:"09f8b0432a075f20bb33",6:"ac4c2c6f7b9b2dad8305",7:"5a275aa794d6e86574f4",8:"34a9cd9e0d1747cc2ab7",9:"0f4f82403c714de438b1",10:"fbf0f59deabc41738ede",11:"f1d7cbde04399d9f2277",12:"208be69c4aa8775f9d5e",13:"d0b765e5919b7a17ef45",14:"19f6c34cf3104d684dc3",15:"1cf0b49eac5dc0730caf",16:"3f7fae1e2e8431ac04a2",17:"507c37add009eb0fffb9",18:"b5bcfabc88d8c13e73e5",19:"c28562505382b38755b4",20:"2f684fdd3c89f5915cc0",21:"d9ca60c85b1e838b6593",22:"f053a165552dfc527084",23:"85889905f55a37fff1a9",24:"5e23bee633309e0a9b01",25:"83236f710f52b0bdf28b",26:"cac9b037048fa94ea20b",27:"213a045d7380e781ae34",28:"e3cf675448715902d8cf",29:"e798dca3389dfabacb95",30:"01677bba1efacce30086",31:"3bbb6fac9f9c58f2a9b3",32:"8d880791c1091468c62b",33:"ee7d4b4ee5cd0ed69326",34:"acbbc3488acfb4c9558b",35:"175d0588e86db3bacbf0",36:"28eb70d85f3c286f360b",37:"fbc16d51d34a46444b95",38:"f47bd6208cd3620264b2",39:"47648c0a69bff502bc23",40:"3052ee99d645c9e5b07c",41:"3763cabba7e127ba6d54",42:"2cd134b76e0094560be2",43:"3e9a35c195fda147f986",44:"ab85e08303d146b6f1e8",45:"aeffffc1121277483f8b",46:"a1ad03c67486d7e0e0d0",47:"2253034d0a312a08431a",48:"0ad5e74f1a79b31a5300",49:"b225bc31a8164d9c7573",50:"7d29cb58dce92109023b",51:"c7755e0990a0e5906f95"}[e]+".js";var r=setTimeout(t,12e4);function t(){n.onerror=n.onload=null,clearTimeout(r);var c=f[e];0!==c&&(c&&c[1](new Error("Loading chunk "+e+" failed.")),f[e]=void 0)}return n.onerror=n.onload=t,d.appendChild(n),a},b.m=e,b.c=a,b.d=function(e,c,a){b.o(e,c)||Object.defineProperty(e,c,{configurable:!1,enumerable:!0,get:a})},b.n=function(e){var c=e&&e.__esModule?function(){return e.default}:function(){return e};return b.d(c,"a",c),c},b.o=function(e,c){return Object.prototype.hasOwnProperty.call(e,c)},b.p="",b.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
!function(e){var a=window.webpackJsonp;window.webpackJsonp=function(c,d,n){for(var r,t,o,i=0,u=[];i<c.length;i++)t=c[i],f[t]&&u.push(f[t][0]),f[t]=0;for(r in d)Object.prototype.hasOwnProperty.call(d,r)&&(e[r]=d[r]);for(a&&a(c,d,n);u.length;)u.shift()();if(n)for(i=0;i<n.length;i++)o=b(b.s=n[i]);return o};var c={},f={54:0};function b(a){if(c[a])return c[a].exports;var f=c[a]={i:a,l:!1,exports:{}};return e[a].call(f.exports,f,f.exports,b),f.l=!0,f.exports}b.e=function(e){var a=f[e];if(0===a)return new Promise(function(e){e()});if(a)return a[2];var c=new Promise(function(c,b){a=f[e]=[c,b]});a[2]=c;var d=document.getElementsByTagName("head")[0],n=document.createElement("script");n.type="text/javascript",n.charset="utf-8",n.async=!0,n.timeout=12e4,b.nc&&n.setAttribute("nonce",b.nc),n.src=b.p+"static/js/"+({0:"vendor-async"}[e]||e)+"."+{0:"1aad2168fb530f5aa4a7",1:"ce466f9e61b92a03cbf3",2:"6350a613c63a85b38581",3:"58a01dba059857bfcdc0",4:"dfaade6e76c72d90bc8a",5:"09f8b0432a075f20bb33",6:"ac4c2c6f7b9b2dad8305",7:"5a275aa794d6e86574f4",8:"34a9cd9e0d1747cc2ab7",9:"0f4f82403c714de438b1",10:"fbf0f59deabc41738ede",11:"f1d7cbde04399d9f2277",12:"208be69c4aa8775f9d5e",13:"d0b765e5919b7a17ef45",14:"19f6c34cf3104d684dc3",15:"1cf0b49eac5dc0730caf",16:"3f7fae1e2e8431ac04a2",17:"648701aebafea0f6f3ae",18:"b5bcfabc88d8c13e73e5",19:"98cb18b3593220fb0e38",20:"330fd2b41aa64c4046e8",21:"d9ca60c85b1e838b6593",22:"f053a165552dfc527084",23:"85889905f55a37fff1a9",24:"5e23bee633309e0a9b01",25:"83236f710f52b0bdf28b",26:"cac9b037048fa94ea20b",27:"213a045d7380e781ae34",28:"e3cf675448715902d8cf",29:"e798dca3389dfabacb95",30:"01677bba1efacce30086",31:"3bbb6fac9f9c58f2a9b3",32:"8d880791c1091468c62b",33:"ee7d4b4ee5cd0ed69326",34:"acbbc3488acfb4c9558b",35:"175d0588e86db3bacbf0",36:"28eb70d85f3c286f360b",37:"fbc16d51d34a46444b95",38:"f47bd6208cd3620264b2",39:"47648c0a69bff502bc23",40:"3052ee99d645c9e5b07c",41:"3763cabba7e127ba6d54",42:"2cd134b76e0094560be2",43:"3e9a35c195fda147f986",44:"ab85e08303d146b6f1e8",45:"aeffffc1121277483f8b",46:"a1ad03c67486d7e0e0d0",47:"2253034d0a312a08431a",48:"0ad5e74f1a79b31a5300",49:"b225bc31a8164d9c7573",50:"7d29cb58dce92109023b",51:"c7755e0990a0e5906f95"}[e]+".js";var r=setTimeout(t,12e4);function t(){n.onerror=n.onload=null,clearTimeout(r);var a=f[e];0!==a&&(a&&a[1](new Error("Loading chunk "+e+" failed.")),f[e]=void 0)}return n.onerror=n.onload=t,d.appendChild(n),c},b.m=e,b.c=c,b.d=function(e,a,c){b.o(e,a)||Object.defineProperty(e,a,{configurable:!1,enumerable:!0,get:c})},b.n=function(e){var a=e&&e.__esModule?function(){return e.default}:function(){return e};return b.d(a,"a",a),a},b.o=function(e,a){return Object.prototype.hasOwnProperty.call(e,a)},b.p="",b.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
......@@ -60,7 +60,7 @@
>购买须知</div>
</div>
<div v-if="tabType" class="detail">
<div v-html="groupDetail.desc.detail" class="detail-content"></div>
<div v-html="groupDetail.desc.detail" v-lazy-container="{ selector: 'img' }" class="detail-content"></div>
</div>
<div v-if="!tabType" class="qa-block">
<div class="qa-content qaDetail" v-html="groupDetail.desc.qa"></div>
......@@ -163,8 +163,7 @@
<div
class="btn"
@click="showTeacher();buttonClick('功能','客服')"
v-if="groupDetail.desc.customer_service[0]"
>
v-if="groupDetail.desc.customer_service[0]">
<img :src="weChatIcon" />
</div>
<div
......@@ -324,6 +323,13 @@ export default {
// })
},
methods: {
letslazyload(contentp) {
let regexp1 = new RegExp(/(\<img )([^>]*)(src=")([^"]*")([^>]*)(\>)/, 'g');
contentp = contentp.replace(regexp1, function(match, p1, p2, p3, p4, p5, p6) {
return p1 + p2 + 'data-src="' + p4 + p5 + p6;
});
return contentp;
},
clear(){
localStorage.clear()
sessionStorage.clear()
......@@ -635,6 +641,7 @@ export default {
}
Toast.clear()
this.groupDetail = res;
this.groupDetail.desc.detail = this.letslazyload(this.groupDetail.desc.detail)
for (let i = 0; i < this.groupDetail.header_url.length; i++) {
this.groupDetail.header_url[i] = this.groupDetail.header_url[
i
......
<template>
<div class="share-page">
<div class="share-block">
<!-- <div class="bg-title" :style="{backgroundImage:`url('${shareBg}')`}">
</div> -->
<!-- <div class="bg-desc">
</div> -->
<div class="content" v-if="userDetail" ref="imageWrapper" id="capture">
<!-- <img :src="shareConBg" class="content-black"/> -->
<div class="main-content">
<div class="topBox">
<img class="shareTitle" :src="shareTitle"/>
<div class="head-block">
<img :src="userDetail.avatar"/>
</div>
<div class="content-title" >
{{userDetail.nickname}}家宝宝
</div>
</div>
<div class="main-text">
<div v-if="watchDetail" class="item">
<div class=""> <img :src="icon_day" alt=""> </div>
<div class="text1">已在唱唱学习</div>
<div class="text2"> <span>{{watchDetail.total_day}}</span></div>
</div>
<div v-if="watchDetail" class="item">
<div class=""><img :src="icon_min" alt=""></div>
<div class="text1">今天学习了</div>
<div class="text2"> <span>{{minute}}</span>分钟</div>
<div>
<div class="drawer-list-on-desktop">
<mu-drawer :open.sync="drawer" :docked="docked" :z-depth="depth">
<mu-appbar style="width: 100%;" title="Select a title" color="#bccc9" text-color="#030f1f"></mu-appbar>
<mu-list textline="three-line" v-loading="loading_list">
<mu-list-item avatar button @click="show(item.ID)" v-for="(item, index) in list" :key="index">
<mu-list-item-content>
<mu-list-item-sub-title class="title-in-list">
{{ item.post_title }}
</mu-list-item-sub-title>
</mu-list-item-content>
<mu-list-item-action>
<mu-list-item-after-text>{{ index + 1 }}</mu-list-item-after-text>
</mu-list-item-action>
</mu-list-item>
</mu-list>
</mu-drawer>
</div>
<div class="blog-body" v-bind:class="{'drawer-push': !is_mobile}" v-loading="loading_content">
<div class="site-title">
<mu-appbar color="#395c7d">
<mu-button icon slot="left" @click="showDrawer" v-show="is_mobile">
<mu-icon value="menu"></mu-icon>
</mu-button>
{{ title }}
<mu-menu slot="right">
<mu-button flat>MENU</mu-button>
<mu-list slot="content">
<mu-list-item button @click="openNewWindow('https://github.com/catscarlet/goodparts-of-your-wordpress-zwei')">
<mu-list-item-content>
<mu-list-item-title>GITHUB</mu-list-item-title>
</mu-list-item-content>
</mu-list-item>
</mu-list>
</mu-menu>
</mu-appbar>
</div>
<div v-if="content.title" class="content">
<div class="title-zone">
<span class="post-title">{{ content.title }}</span>
</div>
<div v-if="watchDetail" class="item">
<div class=""><img :src="icon_baby" alt=""></div>
<div class="text1">超过了</div>
<div class="text2"> <span>{{watchDetail.total_day}}</span><br>同龄人</div>
<div id="real-content" v-if="content.title" class="real-content" v-html="content.content" v-lazy-container="{ selector: 'img' }"></div>
<div v-if="content.link" class="title-zone">
<hr>
<em>Link:
<a :href="content.link" target="_blank">{{ content.link }}</a>
</em>
</div>
</div>
<img class="img_link" :src="img_link" alt="">
<img class="imgPoint" :src="imgPoint" alt="">
</div>
<div class="sing-content">
<div class="text1">今日童谣主题</div>
<div class="text2">{{lesson.title}}</div>
<div class="text3">{{lesson.domTitle}}</div>
<div v-else class="blank">
<welcome />
</div>
<div class="share-btn" @click="showShare()">
<i class="iconfont icon-pengyouquan"></i> 分享到微信
</div>
</div>
</div>
<div class="share_close" @click="$emit('closeShare')">×</div>
<!-- <img :src="share_close" class="share_close" @click="$emit('closeShare')"/> -->
<div class="tips" v-if="shareVisible" @click="shareVisible=false">
<img :src="share_tips">
</div>
</div>
</div>
</template>
<script>
import {Toast} from 'vant'
import shareBg from '../../assets/newLesson/shareBg.png'
import shareTitle from '../../assets/newLesson/img_title.png'
import share_close from '../../assets/newLesson/share_close.png'
import icon_baby from '../../assets/newLesson/icon_baby.png'
import icon_day from '../../assets/newLesson/icon_day.png'
import icon_min from '../../assets/newLesson/icon_min.png'
import img_link from '../../assets/newLesson/img_link.png'
import good from '../../assets/newLesson/good.png'
import great from '../../assets/newLesson/great.png'
import perfect from '../../assets/newLesson/perfect.png'
import QRCode from 'qrcodejs2'
import html2canvas from 'html2canvas'
import {getwechatParam,getUserWatchApi,getShortApi,subUserLessonApi,getCountTimeApi} from "../../service/api";
import share_code_bg from '../../assets/newLesson/share-code-bg.png'
import share_tips from '../../assets/Bitmap@2x.png'
export default {
name: "share",
data(){
return {
img_link:img_link,
shareVisible:false,
shareBg:shareBg,
share_close:share_close,
share_tips:share_tips,
shareTitle:shareTitle,
icon_baby:icon_baby,
icon_day:icon_day,
icon_min:icon_min,
img_link:img_link,
userDetail:null,
dataURL:null,
watchDetail:null,
share_code_bg:share_code_bg,
lesson:{},
domTitle:'',
imgPoint:good,
minute:''
}
import {
isMobile
} from '../common/';
import welcome from './Welcome.vue';
export default {
components: {
welcome,
},
data() {
return {
title: this.$siteconf.title,
api: this.$siteconf.api,
docked: true,
drawer: false,
drawer_position: 'left',
depth: 1,
is_mobile: null,
content: {
'title': '',
'link': '',
'content': '',
},
list: [],
startX: null,
startY: null,
endX: null,
endY: null,
loading_list: true,
loading_content: false,
debug_info: '',
};
},
props:[
'contentData'
],
mounted(){
// console.log(this.contentData)
Toast.loading({
mask: true,
message: ''
});
this.initPage()
beforeMount() {
this.getlist();
},
methods:{
showShare(){
this.shareVisible = true;
this.$sa.track('watchClick',{
dayModule:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9),
weekName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
elementName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9) + '-'+ JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
themeID:JSON.parse(localStorage.getItem('lessonDetail')).themeID,
themeName:JSON.parse(localStorage.getItem('lessonDetail')).themeName,
goodsID:JSON.parse(localStorage.getItem('lessonDetail')).goodsID,
classID:JSON.parse(localStorage.getItem('lessonDetail')).classID,
buttonName:'分享到微信',
partName:this.contentData.partName,
elementID:this.$route.query.elementId.toString(),
});
},
initPage(){
// console.log(this.$store.state.watchDetail)
// debugger
this.lesson = JSON.parse(localStorage.getItem("lessonDetail"));
this.lesson.domTitle = this.lesson.domTitle.substring(0,9)
console.log(this.lesson,123)
this.userDetail = JSON.parse(localStorage.getItem('userDesc'));
getCountTimeApi().then(res =>{
// this.minute = (res[0].stay_time/60).toFixed()
this.minute = (800/60).toFixed()
if(this.minute<1){
this.minute = 1
mounted() {
this.is_mobile = isMobile();
this.handleResize = () => {
this.is_mobile = isMobile();
};
window.addEventListener('resize', this.handleResize);
window.addEventListener('touchstart', this.touchStart);
window.addEventListener('touchmove', this.touchAndMove);
},
methods: {
getlist: function(id, event) {
let self = this;
this.$axios.get(this.api + 'readlist.php')
.then(function(response) {
self.list = response.data;
self.loading_list = false;
})
.catch(function(error) {
self.list = [{
'ID': 9999,
'post_date': '2019-04-01 12:34:56',
'post_title': 'GetList Failed',
'permalink': '',
},];
self.loading_list = false;
});
},
showDrawer: function() {
this.drawer = true;
},
show: function(id, event) {
if (!id) {
return;
}
// this.minute<1?1:1
if(this.minute<=8){
this.imgPoint = good
}else if(this.minute<=12){
this.imgPoint = great
}else{
this.imgPoint = perfect
if (this.is_mobile) {
this.drawer = false;
}
Toast.clear()
})
this.toDataURLBase64(this.userDetail.avatar.replace('http://','https://'), (avatar) =>{
console.log(this.shareConBg)
this.toDataURLBase64(this.shareConBg,(cal)=>{
this.shareConBg = cal;
this.userDetail.avatar = avatar;
this.watchDetail = this.$store.state.watchDetail;
this.$nextTick(()=>{
// this.$refs.share_image.initPage();
let self = this;
self.loading_content = true;
self.content.title = 'Loading...';
self.content.content = '';
self.content.link = '';
this.$axios.get(this.api + '/get_content.php?id=' + id)
.then(function(response) {
self.draw(id, response.data.content);
})
.catch(function(error) {
self.content.title = 'Get Content Failed.';
self.loading_content = false;
}
);
},
draw: function(id, content) {
function maxwidth(contentp) {
let regexp1 = new RegExp(/(\<img[^>]*)(\>)/, 'g');
contentp = contentp.replace(regexp1, function(match, p1, p2) {
return p1 + 'style="max-width: 100%; height: auto;"' + p2;
});
Toast.clear()
let URL = process.env.API_URL+'#/shareGoods?userID='+ this.userDetail.user_id;
this.onShare(URL);
})
});
// console.log(this.contentData)
// debugger
},
enableShare: function(option) {
let query = JSON.parse(sessionStorage.getItem('classQuery'))
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() {
setTimeout(()=>{
that.$sa.track('watchClick',{
dayModule:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9),
weekName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
elementName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9) + '-'+ JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
themeID:JSON.parse(localStorage.getItem('lessonDetail')).themeID,
themeName:JSON.parse(localStorage.getItem('lessonDetail')).themeName,
goodsID:JSON.parse(localStorage.getItem('lessonDetail')).goodsID,
classID:JSON.parse(localStorage.getItem('lessonDetail')).classID,
buttonName:'完成分享',
partName:that.contentData.partName,
elementID:query.elementId.toString(),
});
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail'));
let nowTime = Date.parse(new Date());
let json = {
page_type:0,
page_id:4,
stay_time:0,
};
subUserLessonApi(query.elementId,query.category_id,query.periods_id,json).then(res=>{
lessonDetail.total_watch_time = res;
lessonDetail.nowTime = nowTime;
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail));
});
that.$emit('backList')
},500)
},
cancel: function() {
that.$sa.track('watchClick',{
dayModule:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9),
weekName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
elementName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9) + '-'+ JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
themeID:JSON.parse(localStorage.getItem('lessonDetail')).themeID,
themeName:JSON.parse(localStorage.getItem('lessonDetail')).themeName,
goodsID:JSON.parse(localStorage.getItem('lessonDetail')).goodsID,
classID:JSON.parse(localStorage.getItem('lessonDetail')).classID,
buttonName:'取消分享',
partName:that.contentData.partName,
elementID:query.elementId.toString(),
});
that.$emit('backList')
}
});
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() {
that.$sa.track('watchClick',{
dayModule:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9),
weekName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
elementName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9) + '-'+ JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
themeID:JSON.parse(localStorage.getItem('lessonDetail')).themeID,
themeName:JSON.parse(localStorage.getItem('lessonDetail')).themeName,
goodsID:JSON.parse(localStorage.getItem('lessonDetail')).goodsID,
classID:JSON.parse(localStorage.getItem('lessonDetail')).classID,
buttonName:'完成分享',
partName:that.contentData.partName,
elementID:query.elementId.toString(),
return contentp;
}
function nocaption(contentp) {
let regexp1 = new RegExp(/\[caption .*\"\]/, 'g');
let regexp2 = new RegExp(/(\<img.*\>)(.*)\[\/caption\]/, 'g');
contentp = contentp.replace(regexp1, '<br>');
contentp = contentp.replace(regexp2, function(match, p1, p2) {
return p1 + '<br>' + p2;
});
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail'));
let nowTime = Date.parse(new Date());
let json = {
page_type:0,
page_id:4,
stay_time:0,
};
subUserLessonApi(query.elementId,query.category_id,query.periods_id,json).then(res=>{
lessonDetail.total_watch_time = res;
lessonDetail.nowTime = nowTime;
localStorage.setItem('lessonDetail',JSON.stringify(lessonDetail));
return contentp;
}
function letslazyload(contentp) {
let regexp1 = new RegExp(/(\<img )([^>]*)(src=")([^"]*")([^>]*)(\>)/, 'g');
contentp = contentp.replace(regexp1, function(match, p1, p2, p3, p4, p5, p6) {
return p1 + p2 + 'data-src="' + p4 + p5 + p6;
});
that.$emit('backList')
},
cancel: function() {
that.$sa.track('watchClick',{
dayModule:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9),
weekName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
elementName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9) + '-'+ JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length),
themeID:JSON.parse(localStorage.getItem('lessonDetail')).themeID,
themeName:JSON.parse(localStorage.getItem('lessonDetail')).themeName,
goodsID:JSON.parse(localStorage.getItem('lessonDetail')).goodsID,
classID:JSON.parse(localStorage.getItem('lessonDetail')).classID,
buttonName:'取消分享',
partName:that.contentData.partName,
elementID:query.elementId.toString(),
return contentp;
}
function preCode(contentp) {
let regexp1 = new RegExp(/(\<pre[^>]*)(\>)/, 'g');
contentp = contentp.replace(regexp1, function(match, p1, p2) {
return p1 + 'style="overflow: auto; background-color: #f6f8fa; padding: 16px; line-height: 1.45; border-radius: 3px; font-size: 85%;"' + p2;
});
}
return contentp;
}
let contentp;
let self = this;
this.list.forEach(function(v, i) {
if (v.ID == id) {
self.content.title = v.post_title;
self.content.link = v.permalink;
}
});
})
})
},
onShare(URL) {
if(this.watchDetail&&this.watchDetail.total_day){
this.enableShare({
product_title: `我家宝宝正在【唱唱启蒙英语】唱学英语,已坚持${this.watchDetail.total_day}天`, // 分享标题
desc: JSON.parse(localStorage.getItem('userDesc')).nickname+`赠您【领取超值课程】特权,来唱唱和百万家庭一起快乐启蒙英语吧!`,//
shareIcon:process.env.IMAGE_URL_HEAD+'new-sing/number_Day'+this.watchDetail.total_day+'.jpg',
shareUrl:URL
})
}
},
toDataURLBase64 (src, callback) {
let xhttp = new XMLHttpRequest();
xhttp.onload = function () {
let fileReader = new FileReader();
fileReader.onloadend = function () {
callback(fileReader.result)
};
fileReader.readAsDataURL(xhttp.response)
};
xhttp.responseType = 'blob';
xhttp.open('GET', src, true);
xhttp.send()
},
getOffsetRect(ele){
var box=ele.getBoundingClientRect();
var body=document.body,
docElem=document.documentElement;
//获取页面的scrollTop,scrollLeft(兼容性写法)
var scrollTop=window.pageYOffset||docElem.scrollTop||body.scrollTop,
scrollLeft=window.pageXOffset||docElem.scrollLeft||body.scrollLeft;
var clientTop=docElem.clientTop||body.clientTop,
clientLeft=docElem.clientLeft||body.clientLeft;
var top=box.top+scrollTop-clientTop,
left=box.left+scrollLeft-clientLeft;
return {
//Math.round 兼容火狐浏览器bug
top:Math.round(top),
left:Math.round(left)
}
},
qrcode(data){
if(this.QRCodeB){
this.QRCodeB.makeCode(data)
}else{
this.QRCodeB = new QRCode('qrcode', {
width: 70,
height: 70, // 高度
text: data, // 二维码内容
image: ''
});
}
},
}
}
</script>
<style scoped lang="less">
@import "../../util/public";
.share-page{
position: fixed;
background: url('https://cdn.singsingenglish.com/new-sing/5ee147390f18487738f2a5521110c96057a77731.png');
background-size:100% ;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 1300;
.share-block{
position: absolute;
border-radius: 8*@toVw;
top: 20*@toVw;
left: 20*@toVw;
right: 20*@toVw;
// background: white;
bottom: 0;
overflow: auto;
.bg-title{
position: absolute;
top: 0;
left: 0;
right: 0;
height: 60*@toVw;
background-size: 100% 100%;
z-index: -1;
}
.bg-desc{
position: absolute;
top: 58*@toVw;
left: 0;
right: 0;
bottom: 0;
// background: white;
z-index: -1;
border-radius: 0 0 8*@toVw 8*@toVw;
}
#cvs-img{
position: absolute;
width: 100%;
// top: -3*@toVw;
left: 0;
z-index: 1;
}
.content{
width: 100%;
height: (480-53)*@toVw;
padding-top: 110*@toVw;
// margin-top: 20*@toVw;
background-size: 100% 100%;
position: relative;
.content-black{
position: absolute;
z-index: -1;
width: 100%;
height: 100%;
top: 0;
right: 0;
left: 0;
bottom: 0;
}
}
.main-content{
width: 322*@toVw;
height: 201*@toVw;
background: white;
border-radius: 8*@toVw;
position: relative;
.img_link{
position: absolute;
width: 260*@toVw;
bottom: -49*@toVw;
left: 33*@toVw;
}
.imgPoint{
position: absolute;
width: 85 * @toVw;
top: 40*@toVw;
left: 80 * @toVw;
opacity: 0;
scale: 2;
@keyframes pointMove
{
from {top: 40*@toVw;left: 80 * @toVw;transform:scale(2,2);opacity:0;}
to {top: -60*@toVw;left: 229 * @toVw;transform:scale(1,1);opacity:1;}
contentp = this.$autop(content);
contentp = maxwidth(contentp);
contentp = nocaption(contentp);
contentp = letslazyload(contentp);
contentp = preCode(contentp);
window.scrollTo(0, 0);
this.content.content = contentp;
self.loading_content = false;
},
openNewWindow: function(url) {
let win = window.open(url, '_blank');
if (win) {
//Browser has allowed it to be opened
win.focus();
} else {
//Browser has blocked it
alert('Please allow popups for this website');
}
},
changeNav: function() {
if (this.is_mobile) {
this.docked = false;
this.drawer = false;
this.depth = 16;
} else {
this.docked = true;
this.drawer = true;
this.depth = 1;
}
animation:pointMove 0.375s 1s ease ;
animation-fill-mode:forwards;
}
.topBox{
position: absolute;
top: -34*@toVw;
left: 48*@toVw;
.shareTitle{width: 223*@toVw;}
}
.main-text{
padding-top: 50*@toVw;
text-align: center;
margin: auto;
margin-bottom: 0;
display: flex;
.item{
flex: 1;
margin: 0;
.text1{color: #5F696E;font-size: 13*@toVw;margin: 8*@toVw 0;}
img{width: 46*@toVw;}
.text2{
font-size: 11*@toVw;
color: #5F696E;
span{color: #EC7E1F;font-size: 22*@toVw;}
},
touchStart: function(event) {
this.startX = event.changedTouches[0].pageX;
this.startY = event.changedTouches[0].pageY;
},
touchAndMove: function(event) {
let startX = this.startX;
let startY = this.startY;
let endX = event.changedTouches[0].pageX;
let endY = event.changedTouches[0].pageY;
let distanceX = endX - startX;
let distanceY = endY - startY;
this.debug_info = distanceX + '<br>' + distanceY;
if (Math.abs(distanceX) > Math.abs(distanceY) && distanceX > 100) {
this.drawer = true;
} else if (Math.abs(distanceX) > Math.abs(distanceY) && distanceX < 100) {
this.drawer = false;
} else if (Math.abs(distanceX) < Math.abs(distanceY) && distanceY < 100) {
} else if (Math.abs(distanceX) < Math.abs(distanceY) && distanceY > 100) {
} else {
}
}
}
.head-block{
position: absolute;
text-align: center;
border-radius: 200*@toVw;
// left: 50%;
width: 100%;
text-align: center;
top: -52*@toVw;
img{
border:8*@toVw solid #72CEFA;
border-radius: 200*@toVw;
width: 62*@toVw;
margin-top: 7*@toVw;
height: 62*@toVw;
}
}
.content-title{
width: 226*@toVw;
height: 54*@toVw;
line-height: 26*@toVw;
margin-top: 40*@toVw;
color: #55343A;
// background: white;
font-size: 14*@toVw;
text-align: center;
background-size: 99.99% 99.99%;
position: absolute;
top: -14*@toVw;
color: white;
// left: 50%;
// margin-left: -112.5*@toVw;
}
}
.sing-content{
background: white;
border-radius: 10*@toVw;
margin-top: 30*@toVw;
padding: 20*@toVw 0;
text-align: center;
.text1{margin:0 0 20*@toVw;font-size: 13*@toVw;}
.text2{color: #1D6588;font-size: 22*@toVw;
margin-bottom: 10*@toVw;width: 318*@toVw;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.text3{color: #1D6588;}
}
.share-btn{
margin-top: 20*@toVw;
text-align: center;
width: 255*@toVw;
height: 44*@toVw;
background:linear-gradient(0deg,rgba(243,180,3,1) 1%,rgba(252,231,171,1) 100%);
text-shadow:0px 3px 3px rgba(170,127,4,0.59);
// box-shadow:0px 3*@toVw 16*@toVw 0px rgba(200,96,37,0.59);
border-radius:22*@toVw;
color: white;
line-height: 44*@toVw;
font-size: 18*@toVw;
box-shadow:0px 3*@toVw 16*@toVw 0px rgba(250,208,88,0.59);
.iconfont{font-size: 18*@toVw;}
img{
width: 270*@toVw;
}
}
}
.share_close{
position: fixed;
width: 20*@toVw;
top: 26*@toVw;
right: 14*@toVw;
z-index: 999;
color: white;
font-size: 16*@toVw;
}
.tips{
background: rgba(0,0,0,0.8);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding-right: 19*@toVw;
z-index: 99999999;
text-align: right;
img{
width: 80%;
}
}
}
</style>
},
},
watch: {
is_mobile: function(val, oldVal) {
this.changeNav();
},
},
};
</script>
<style scoped>
.drawer-push {
padding-left: 256px;
}
.site-title {
position: fixed;
width: 100%;
height: 56px;
opacity: 0.85;
}
.title-zone {
text-align: center;
padding-top: 96px;
padding-bottom: 40px;
border-bottom: 1px solid grey;
}
.post-title {
color: rgba(0, 0, 0, .8);
letter-spacing: -.02em;
font-size: 180%;
font-weight: 400;
margin: 0 !important;
padding: 10px 12px;
word-wrap: break-word;
}
.title-in-list {
color: rgba(0, 0, 0, .7);
}
.content {
max-width: 800px;
margin: 0 auto;
background-color: white;
}
.real-content {
font-size: 100%;
line-height: 165%;
padding-bottom: 50px;
padding-left: 20px;
padding-right: 20px;
overflow: hidden;
word-wrap: break-word;
}
.blank {
max-width: 800px;
margin: 0 auto;
text-align: center;
padding-top: 45vh;
padding-bottom: 40px;
font-size: large;
}
</style>
\ No newline at end of file
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