730

parent 7f117f35
...@@ -11,4 +11,4 @@ ...@@ -11,4 +11,4 @@
position: fixed; position: fixed;
background: #f4f4f4; 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> /* 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 \ 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}}([]); !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 \ No newline at end of file
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
>购买须知</div> >购买须知</div>
</div> </div>
<div v-if="tabType" class="detail"> <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>
<div v-if="!tabType" class="qa-block"> <div v-if="!tabType" class="qa-block">
<div class="qa-content qaDetail" v-html="groupDetail.desc.qa"></div> <div class="qa-content qaDetail" v-html="groupDetail.desc.qa"></div>
...@@ -163,8 +163,7 @@ ...@@ -163,8 +163,7 @@
<div <div
class="btn" class="btn"
@click="showTeacher();buttonClick('功能','客服')" @click="showTeacher();buttonClick('功能','客服')"
v-if="groupDetail.desc.customer_service[0]" v-if="groupDetail.desc.customer_service[0]">
>
<img :src="weChatIcon" /> <img :src="weChatIcon" />
</div> </div>
<div <div
...@@ -324,6 +323,13 @@ export default { ...@@ -324,6 +323,13 @@ export default {
// }) // })
}, },
methods: { 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(){ clear(){
localStorage.clear() localStorage.clear()
sessionStorage.clear() sessionStorage.clear()
...@@ -635,6 +641,7 @@ export default { ...@@ -635,6 +641,7 @@ export default {
} }
Toast.clear() Toast.clear()
this.groupDetail = res; this.groupDetail = res;
this.groupDetail.desc.detail = this.letslazyload(this.groupDetail.desc.detail)
for (let i = 0; i < this.groupDetail.header_url.length; i++) { for (let i = 0; i < this.groupDetail.header_url.length; i++) {
this.groupDetail.header_url[i] = this.groupDetail.header_url[ this.groupDetail.header_url[i] = this.groupDetail.header_url[
i i
......
<template> <template>
<div class="share-page"> <div>
<div class="share-block">
<!-- <div class="bg-title" :style="{backgroundImage:`url('${shareBg}')`}"> <div class="drawer-list-on-desktop">
</div> --> <mu-drawer :open.sync="drawer" :docked="docked" :z-depth="depth">
<!-- <div class="bg-desc"> <mu-appbar style="width: 100%;" title="Select a title" color="#bccc9" text-color="#030f1f"></mu-appbar>
</div> --> <mu-list textline="three-line" v-loading="loading_list">
<div class="content" v-if="userDetail" ref="imageWrapper" id="capture"> <mu-list-item avatar button @click="show(item.ID)" v-for="(item, index) in list" :key="index">
<!-- <img :src="shareConBg" class="content-black"/> --> <mu-list-item-content>
<div class="main-content"> <mu-list-item-sub-title class="title-in-list">
<div class="topBox"> {{ item.post_title }}
<img class="shareTitle" :src="shareTitle"/> </mu-list-item-sub-title>
<div class="head-block"> </mu-list-item-content>
<img :src="userDetail.avatar"/> <mu-list-item-action>
</div> <mu-list-item-after-text>{{ index + 1 }}</mu-list-item-after-text>
<div class="content-title" > </mu-list-item-action>
{{userDetail.nickname}}家宝宝 </mu-list-item>
</div> </mu-list>
</div> </mu-drawer>
<div class="main-text">
<div v-if="watchDetail" class="item"> </div>
<div class=""> <img :src="icon_day" alt=""> </div>
<div class="text1">已在唱唱学习</div> <div class="blog-body" v-bind:class="{'drawer-push': !is_mobile}" v-loading="loading_content">
<div class="text2"> <span>{{watchDetail.total_day}}</span></div> <div class="site-title">
</div> <mu-appbar color="#395c7d">
<div v-if="watchDetail" class="item">
<div class=""><img :src="icon_min" alt=""></div> <mu-button icon slot="left" @click="showDrawer" v-show="is_mobile">
<div class="text1">今天学习了</div> <mu-icon value="menu"></mu-icon>
<div class="text2"> <span>{{minute}}</span>分钟</div> </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>
<div v-if="watchDetail" class="item">
<div class=""><img :src="icon_baby" alt=""></div> <div id="real-content" v-if="content.title" class="real-content" v-html="content.content" v-lazy-container="{ selector: 'img' }"></div>
<div class="text1">超过了</div>
<div class="text2"> <span>{{watchDetail.total_day}}</span><br>同龄人</div> <div v-if="content.link" class="title-zone">
<hr>
<em>Link:
<a :href="content.link" target="_blank">{{ content.link }}</a>
</em>
</div> </div>
</div>
<img class="img_link" :src="img_link" alt="">
<img class="imgPoint" :src="imgPoint" alt="">
</div> </div>
<div class="sing-content">
<div class="text1">今日童谣主题</div> <div v-else class="blank">
<div class="text2">{{lesson.title}}</div> <welcome />
<div class="text3">{{lesson.domTitle}}</div>
</div> </div>
<div class="share-btn" @click="showShare()">
<i class="iconfont icon-pengyouquan"></i> 分享到微信
</div>
</div>
</div> </div>
<div class="share_close" @click="$emit('closeShare')">×</div>
<!-- <img :src="share_close" class="share_close" @click="$emit('closeShare')"/> --> </div>
<div class="tips" v-if="shareVisible" @click="shareVisible=false">
<img :src="share_tips">
</div>
</div>
</template> </template>
<script> <script>
import {Toast} from 'vant' import {
import shareBg from '../../assets/newLesson/shareBg.png' isMobile
import shareTitle from '../../assets/newLesson/img_title.png' } from '../common/';
import share_close from '../../assets/newLesson/share_close.png' import welcome from './Welcome.vue';
import icon_baby from '../../assets/newLesson/icon_baby.png' export default {
import icon_day from '../../assets/newLesson/icon_day.png' components: {
import icon_min from '../../assets/newLesson/icon_min.png' welcome,
import img_link from '../../assets/newLesson/img_link.png' },
import good from '../../assets/newLesson/good.png' data() {
import great from '../../assets/newLesson/great.png' return {
import perfect from '../../assets/newLesson/perfect.png' title: this.$siteconf.title,
import QRCode from 'qrcodejs2' api: this.$siteconf.api,
import html2canvas from 'html2canvas' docked: true,
import {getwechatParam,getUserWatchApi,getShortApi,subUserLessonApi,getCountTimeApi} from "../../service/api"; drawer: false,
import share_code_bg from '../../assets/newLesson/share-code-bg.png' drawer_position: 'left',
import share_tips from '../../assets/Bitmap@2x.png' depth: 1,
export default { is_mobile: null,
name: "share", content: {
data(){ 'title': '',
return { 'link': '',
img_link:img_link, 'content': '',
shareVisible:false, },
shareBg:shareBg, list: [],
share_close:share_close, startX: null,
share_tips:share_tips, startY: null,
shareTitle:shareTitle, endX: null,
icon_baby:icon_baby, endY: null,
icon_day:icon_day, loading_list: true,
icon_min:icon_min, loading_content: false,
img_link:img_link, debug_info: '',
userDetail:null, };
dataURL:null,
watchDetail:null,
share_code_bg:share_code_bg,
lesson:{},
domTitle:'',
imgPoint:good,
minute:''
}
}, },
props:[ beforeMount() {
'contentData' this.getlist();
],
mounted(){
// console.log(this.contentData)
Toast.loading({
mask: true,
message: ''
});
this.initPage()
}, },
methods:{ mounted() {
showShare(){ this.is_mobile = isMobile();
this.shareVisible = true; this.handleResize = () => {
this.$sa.track('watchClick',{ this.is_mobile = isMobile();
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), window.addEventListener('resize', this.handleResize);
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), window.addEventListener('touchstart', this.touchStart);
themeID:JSON.parse(localStorage.getItem('lessonDetail')).themeID, window.addEventListener('touchmove', this.touchAndMove);
themeName:JSON.parse(localStorage.getItem('lessonDetail')).themeName, },
goodsID:JSON.parse(localStorage.getItem('lessonDetail')).goodsID, methods: {
classID:JSON.parse(localStorage.getItem('lessonDetail')).classID, getlist: function(id, event) {
buttonName:'分享到微信', let self = this;
partName:this.contentData.partName, this.$axios.get(this.api + 'readlist.php')
elementID:this.$route.query.elementId.toString(), .then(function(response) {
}); self.list = response.data;
}, self.loading_list = false;
initPage(){ })
// console.log(this.$store.state.watchDetail) .catch(function(error) {
// debugger self.list = [{
this.lesson = JSON.parse(localStorage.getItem("lessonDetail")); 'ID': 9999,
this.lesson.domTitle = this.lesson.domTitle.substring(0,9) 'post_date': '2019-04-01 12:34:56',
console.log(this.lesson,123) 'post_title': 'GetList Failed',
this.userDetail = JSON.parse(localStorage.getItem('userDesc')); 'permalink': '',
getCountTimeApi().then(res =>{ },];
// this.minute = (res[0].stay_time/60).toFixed() self.loading_list = false;
this.minute = (800/60).toFixed() });
if(this.minute<1){ },
this.minute = 1 showDrawer: function() {
this.drawer = true;
},
show: function(id, event) {
if (!id) {
return;
} }
// this.minute<1?1:1 if (this.is_mobile) {
if(this.minute<=8){ this.drawer = false;
this.imgPoint = good
}else if(this.minute<=12){
this.imgPoint = great
}else{
this.imgPoint = perfect
} }
Toast.clear() let self = this;
}) self.loading_content = true;
this.toDataURLBase64(this.userDetail.avatar.replace('http://','https://'), (avatar) =>{ self.content.title = 'Loading...';
console.log(this.shareConBg) self.content.content = '';
this.toDataURLBase64(this.shareConBg,(cal)=>{ self.content.link = '';
this.shareConBg = cal; this.$axios.get(this.api + '/get_content.php?id=' + id)
this.userDetail.avatar = avatar; .then(function(response) {
this.watchDetail = this.$store.state.watchDetail; self.draw(id, response.data.content);
this.$nextTick(()=>{ })
// this.$refs.share_image.initPage(); .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() return contentp;
let URL = process.env.API_URL+'#/shareGoods?userID='+ this.userDetail.user_id; }
this.onShare(URL); function nocaption(contentp) {
}) let regexp1 = new RegExp(/\[caption .*\"\]/, 'g');
}); let regexp2 = new RegExp(/(\<img.*\>)(.*)\[\/caption\]/, 'g');
// console.log(this.contentData) contentp = contentp.replace(regexp1, '<br>');
// debugger contentp = contentp.replace(regexp2, function(match, p1, p2) {
}, return p1 + '<br>' + p2;
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(),
}); });
let lessonDetail = JSON.parse(localStorage.getItem('lessonDetail')); return contentp;
let nowTime = Date.parse(new Date()); }
let json = { function letslazyload(contentp) {
page_type:0, let regexp1 = new RegExp(/(\<img )([^>]*)(src=")([^"]*")([^>]*)(\>)/, 'g');
page_id:4, contentp = contentp.replace(regexp1, function(match, p1, p2, p3, p4, p5, p6) {
stay_time:0, return p1 + p2 + 'data-src="' + p4 + p5 + p6;
};
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') return contentp;
}, }
cancel: function() { function preCode(contentp) {
that.$sa.track('watchClick',{ let regexp1 = new RegExp(/(\<pre[^>]*)(\>)/, 'g');
dayModule:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(0,9), contentp = contentp.replace(regexp1, function(match, p1, p2) {
weekName:JSON.parse(localStorage.getItem('lessonDetail')).domTitle.slice(10,JSON.parse(localStorage.getItem('lessonDetail')).domTitle.length), return p1 + 'style="overflow: auto; background-color: #f6f8fa; padding: 16px; line-height: 1.45; border-radius: 3px; font-size: 85%;"' + p2;
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;
}
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;
}
}); });
}) contentp = this.$autop(content);
}) contentp = maxwidth(contentp);
}, contentp = nocaption(contentp);
onShare(URL) { contentp = letslazyload(contentp);
if(this.watchDetail&&this.watchDetail.total_day){ contentp = preCode(contentp);
this.enableShare({ window.scrollTo(0, 0);
product_title: `我家宝宝正在【唱唱启蒙英语】唱学英语,已坚持${this.watchDetail.total_day}天`, // 分享标题 this.content.content = contentp;
desc: JSON.parse(localStorage.getItem('userDesc')).nickname+`赠您【领取超值课程】特权,来唱唱和百万家庭一起快乐启蒙英语吧!`,// self.loading_content = false;
shareIcon:process.env.IMAGE_URL_HEAD+'new-sing/number_Day'+this.watchDetail.total_day+'.jpg', },
shareUrl:URL openNewWindow: function(url) {
}) let win = window.open(url, '_blank');
} if (win) {
}, //Browser has allowed it to be opened
toDataURLBase64 (src, callback) { win.focus();
let xhttp = new XMLHttpRequest(); } else {
xhttp.onload = function () { //Browser has blocked it
let fileReader = new FileReader(); alert('Please allow popups for this website');
fileReader.onloadend = function () { }
callback(fileReader.result) },
}; changeNav: function() {
fileReader.readAsDataURL(xhttp.response) if (this.is_mobile) {
}; this.docked = false;
xhttp.responseType = 'blob'; this.drawer = false;
xhttp.open('GET', src, true); this.depth = 16;
xhttp.send() } else {
}, this.docked = true;
getOffsetRect(ele){ this.drawer = true;
var box=ele.getBoundingClientRect(); this.depth = 1;
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;}
} }
animation:pointMove 0.375s 1s ease ; },
animation-fill-mode:forwards; touchStart: function(event) {
} this.startX = event.changedTouches[0].pageX;
.topBox{ this.startY = event.changedTouches[0].pageY;
position: absolute; },
top: -34*@toVw; touchAndMove: function(event) {
left: 48*@toVw; let startX = this.startX;
.shareTitle{width: 223*@toVw;} let startY = this.startY;
} let endX = event.changedTouches[0].pageX;
.main-text{ let endY = event.changedTouches[0].pageY;
padding-top: 50*@toVw; let distanceX = endX - startX;
text-align: center; let distanceY = endY - startY;
margin: auto; this.debug_info = distanceX + '<br>' + distanceY;
margin-bottom: 0; if (Math.abs(distanceX) > Math.abs(distanceY) && distanceX > 100) {
display: flex; this.drawer = true;
.item{ } else if (Math.abs(distanceX) > Math.abs(distanceY) && distanceX < 100) {
flex: 1; this.drawer = false;
margin: 0; } else if (Math.abs(distanceX) < Math.abs(distanceY) && distanceY < 100) {
.text1{color: #5F696E;font-size: 13*@toVw;margin: 8*@toVw 0;} } else if (Math.abs(distanceX) < Math.abs(distanceY) && distanceY > 100) {
img{width: 46*@toVw;} } else {
.text2{
font-size: 11*@toVw;
color: #5F696E;
span{color: #EC7E1F;font-size: 22*@toVw;}
} }
} },
} },
.head-block{ watch: {
position: absolute; is_mobile: function(val, oldVal) {
text-align: center; this.changeNav();
border-radius: 200*@toVw; },
// left: 50%; },
width: 100%; };
text-align: center; </script>
top: -52*@toVw;
img{ <style scoped>
border:8*@toVw solid #72CEFA; .drawer-push {
border-radius: 200*@toVw; padding-left: 256px;
width: 62*@toVw; }
margin-top: 7*@toVw; .site-title {
height: 62*@toVw; position: fixed;
} width: 100%;
} height: 56px;
.content-title{ opacity: 0.85;
width: 226*@toVw; }
height: 54*@toVw; .title-zone {
line-height: 26*@toVw; text-align: center;
margin-top: 40*@toVw; padding-top: 96px;
color: #55343A; padding-bottom: 40px;
// background: white; border-bottom: 1px solid grey;
font-size: 14*@toVw; }
text-align: center; .post-title {
background-size: 99.99% 99.99%; color: rgba(0, 0, 0, .8);
position: absolute; letter-spacing: -.02em;
top: -14*@toVw; font-size: 180%;
color: white; font-weight: 400;
// left: 50%; margin: 0 !important;
// margin-left: -112.5*@toVw; padding: 10px 12px;
} word-wrap: break-word;
} }
.sing-content{ .title-in-list {
background: white; color: rgba(0, 0, 0, .7);
border-radius: 10*@toVw; }
margin-top: 30*@toVw; .content {
padding: 20*@toVw 0; max-width: 800px;
text-align: center; margin: 0 auto;
.text1{margin:0 0 20*@toVw;font-size: 13*@toVw;} background-color: white;
.text2{color: #1D6588;font-size: 22*@toVw; }
margin-bottom: 10*@toVw;width: 318*@toVw; .real-content {
overflow: hidden; font-size: 100%;
text-overflow: ellipsis; line-height: 165%;
white-space: nowrap; padding-bottom: 50px;
} padding-left: 20px;
.text3{color: #1D6588;} padding-right: 20px;
} overflow: hidden;
.share-btn{ word-wrap: break-word;
margin-top: 20*@toVw; }
text-align: center; .blank {
width: 255*@toVw; max-width: 800px;
height: 44*@toVw; margin: 0 auto;
background:linear-gradient(0deg,rgba(243,180,3,1) 1%,rgba(252,231,171,1) 100%); text-align: center;
text-shadow:0px 3px 3px rgba(170,127,4,0.59); padding-top: 45vh;
// box-shadow:0px 3*@toVw 16*@toVw 0px rgba(200,96,37,0.59); padding-bottom: 40px;
border-radius:22*@toVw; font-size: large;
color: white; }
line-height: 44*@toVw; </style>
font-size: 18*@toVw; \ No newline at end of file
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>
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