Skip to content

H
h5-base
Commit bd0af7ae authored by wangwei's avatar wangwei
Browse files
Options

投放 去除客服

parent 31bd8272
Show whitespace changes
Inline Side-by-side
Showing with 260 additions and 206 deletions
index.html
View file @ bd0af7ae
......@@ -9,7 +9,9 @@
<title>唱唱启蒙英语</title>
<link rel="stylesheet" href="https://at.alicdn.com/t/font_822651_g9r2j7kybxu.css">
<style>
.mint-toast{
z-index: 10001 !important;
}
</style>
</head>
<body>
......
indexMaster.html
View file @ bd0af7ae
......@@ -12,6 +12,9 @@
*{
-webkit-overflow-scrolling:touch;
}
.mint-toast{
z-index: 10001 !important;
}
</style>
</head>
<body>
......
src/components/buy/buy.vue
View file @ bd0af7ae
......@@ -48,7 +48,7 @@
<div class="sub-block">
合计金额：
<span>￥{{priceTotal}}</span>
<div class="pay-btn" @click="payOrder(orderFlag)">提交订单</div>
<div class="pay-btn" @click="payOrder(orderFlag)">确认支付</div>
</div>
</footer>
<transition name="slide-fade">
......@@ -249,10 +249,6 @@
this.addressPop = true
},
initPage(){
if(!JSON.parse(localStorage.getItem('userDesc')).mobile|| JSON.parse(localStorage.getItem('userDesc')).mobile === ''){
this.$router.push({name:'bindMobile',query:{retUrl:this.$route.fullPath}})
}else
{
getwechatParam({api_list:'chooseWXPay'}).then(res=>{
wx.config({
debug: false,
......@@ -308,7 +304,6 @@
}
}
}
}
</script>
<style scoped lang="less">
......
src/components/buy/index.vue
View file @ bd0af7ae
......@@ -18,7 +18,6 @@
<span class="price-content">￥{{groupDetail.current_price/100}}元</span>
<span style="text-decoration:line-through;color: #bbb;font-size: 14px" v-if="groupDetail.goods_type === 1 && groupDetail.original_price > groupDetail.current_price">￥{{groupDetail.original_price/100}}</span>
</div>
</div>
<div class="head-icon">
<img class="icon" v-for="(data,index) in groupDetail.header_url" v-if="index<5" :src="data" :key="data">
......@@ -114,21 +113,41 @@
</div>
</footer>
</div>
<mt-popup
v-model="bindMobile.show"
class="bindMobile-block"
position="bottom">
<div class="bindMobile-main">
<img :src="groupDetail.goods_desc.img[0].url" class="header">
<div class="title">
{{groupDetail.name}}
<br>
<span style="color: red;font-weight: normal">￥{{(groupDetail.current_price/100).toFixed(2)}}</span>
</div>
<mt-field style="font-size: 14px" label="手机号" placeholder="请输入手机号" v-model="bindMobile.mobile"></mt-field>
<mt-field label="图片验证" placeholder="请输入验证码" v-model="bindMobile.img_code">
<img src="/api/public/img/verify" style="width: 35vw;margin-left: 5px" class="right-btn" ref="imgCode" @click="refImgCode"/>
</mt-field>
<mt-field label="短信验证" placeholder="短信验证码" v-model="bindMobile.verify_code">
<button class="codeMsg right-btn" @click="sendMobileCode" v-if="time===0">发送验证码</button>
<button class="codeMsg disabled right-btn" v-if="time>0">{{time}}s后重新发送</button>
</mt-field>
<mt-button type="danger" style="width: 100%;margin-top: 10px" @click="onBindMobile">下一步</mt-button>
</div>
</mt-popup>
</div>
</template>
<script>
import 'swiper/dist/css/swiper.css'
import { swiper, swiperSlide } from 'vue-awesome-swiper'
import QRCode from 'qrcodejs2'
import { Indicator } from 'mint-ui';
import {getwechatParam,getGoodsDetailApi,getGroupDetailApi,getStatusWechatApi} from "../../service/api";
import { Toast } from 'mint-ui';
import {getwechatParam,getGoodsDetailApi,bindMobileApi,getUserDetailApi,sendMobileCodeApi,getGroupDetailApi,getStatusWechatApi} from "../../service/api";
import refBg from '../../assets/refBg.png'
import moreUrl from '../../assets/moreIcon.png'
import weChatIcon from '../../assets/wechatIcon.png'
import weChatQrUrl from '../../assets/weChatCode.png'
import closeUrl from '../../assets/closemy.png'
import html2canvas from 'html2canvas'
export default {
name: "index",
components: {
......@@ -138,6 +157,12 @@
data(){
return {
refBg:refBg,
bindMobile:{
show:false,
mobile:'',
img_code:'',
verify_code:''
},
join:false,
popType:false,
popFill:false,
......@@ -159,11 +184,13 @@
QRCodeB:false,
payFlag:true,
dataURL:null,
time:0,
user_id:null,
invite_code_f:true,
invite_code:'',
this_code:'',
shopId:'',
buyType:'',
groupId:null,
groupDetail:false,
groupData:null,
......@@ -173,111 +200,135 @@
this.getDetail();
},
methods:{
goToActivity(){
let query = {}
if(window.location.href.indexOf('shopId')>-1){
query.shopId = this.$route.query.shopId;
onBindMobile(){
this.$sa.track('clickSignUp',{});
if(this.payFlag){
this.payFlag = false;
if(this.bindMobile.verify_code===''||!this.bindMobile.verify_code) {
Toast('请填写手机验证码');
return false;
}
if(window.location.href.indexOf('groupId')>-1){
query.groupId = this.$route.query.groupId;
let json={
verify_code:this.bindMobile.verify_code
};
let mobileCheck = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/;
if(this.bindMobile.mobile.match(mobileCheck)){
json.mobile = this.bindMobile.mobile
}else{
Toast('请正确填写手机号');
return false
}
if(window.location.href.indexOf('invite_code')> -1) {
query.invite_code = this.$route.query.invite_code;
bindMobileApi(json).then(data=>{
getUserDetailApi().then(res=>{
localStorage.setItem('userDesc',JSON.stringify(res));
this.payFlag = true;
this.goToBuyPage()
})
}).catch(res=>{
this.refImgCode();
this.payFlag = true
})
}
this.$router.push({name:'activity',query:query})
},
refshow(){
Indicator.open();
if(document.body.scrollTop < 10){
document.body.scrollTop = 20;
document.documentElement.scrollTop = 20;
}
if(localStorage.getItem('cc_token') && localStorage.getItem('cc_token') !== ''){
timeO(){
if(this.time>0){
this.time--;
setTimeout(()=>{
Indicator.close();
if(!this.invite_code){
this.invite_code = 'CC-USER'
this.timeO()
},1000)
}
let invite_code = this.invite_code.split('-');
if(invite_code.length > 2 && invite_code[1] === 'TEACHER'){
invite_code[1] = 'USER'
},
goToBuyPage(){
let query = {shopId: this.shopId,invite_code:this.invite_code};
if(this.groupId){
query.group_order_id = this.groupId
}
let code = `${invite_code[0]}-${invite_code[1]}`;
let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${code}-${this.user_id}`;
if(this.groupId && this.groupId !== 'null'){
URL += `&groupId=${this.groupId}`
if(this.buyType === 0 && !this.groupId){
query.type='single';
this.buyType = 'single';
}else if (this.buyType === 0 && this.groupId){
this.$router.push({
name: 'buyDetail',
query:{
shopId:this.shopId,
invite_code:this.invite_code
}
this.qrcode(URL);
this.refVisible = true;
});
window.location.reload();
return false
} else{
query.type=''
}
let invite = this.invite_code;
this.$sa.track('buyCourse',{
buyType:this.groupDetail.goods_type === 2 && buyType !== 'single' ? '团购' : '直购',
goodsID:this.shopId,
salesType:invite?invite.split('-')[1]:'null',
salesID:invite?Number(invite.split('-')[2]):0
});
if(window.location.href.indexOf('gdt_vid')>-1){
query.gdt_vid = this.$route.query.gdt_vid
}
if(window.location.href.indexOf('cct_user_id')>-1){
query.cct_user_id = this.$route.query.cct_user_id
}
this.$router.push({
name: 'buy',
query:query
});
this.$nextTick(()=>{
if(!this.dataURL){
setTimeout(()=>{
let {
height,
width
} = document.getElementById('capture').getClientRects()[0]
document.getElementById('capture').style.width = width + 'px';
let o = this.getOffsetRect(this.$refs.imageWrapper);
let {
height1,
width1
} = document.getElementById('capture').getClientRects()[0];
console.log(height1)
html2canvas(document.getElementById('capture'),{
async: true,
timeout: 500,
scrollX:1,
scale: 3,
width: width1,
height: height1,
letterRendering: true,
}).then((canvas) => {
let dataURL = canvas.toDataURL("image/jpg");
this.dataURL = dataURL;
}).catch(res=>{alert(res);console.log()});
},500)
}else{
this.payFlag=true;
});
},
refImgCode(){
this.$refs.imgCode.src='/api/public/img/verify?flag='+Math.random()
},
sendMobileCode(){
if(this.bindMobile.img_code===''||!this.bindMobile.img_code){
Toast({message:'请填写图形验证码'});
return false;
}
let json={
img_code:this.bindMobile.img_code
};
let mobileCheck = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/;
if(this.bindMobile.mobile.match(mobileCheck)){
json.mobile = this.bindMobile.mobile
}else{
Toast('请正确填写手机号');
return false
}
})
},500)
this.time=30;
this.timeO();
this.$sa.track('clickSendcode',{});
sendMobileCodeApi(json).then(res=>{
if(res === '操作成功'){
Toast('验证码已发送');
}else{
let query = {retUrl:this.$route.fullPath,is_new_user_url:'1'};
this.$router.push({name:'author',query:query})
this.time = 0;
this.refImgCode();
Toast(res);
}
}).catch(res=>{
this.refImgCode();
})
},
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)
goToActivity(){
let query = {}
if(window.location.href.indexOf('shopId')>-1){
query.shopId = this.$route.query.shopId;
}
},
qrcode(data){
if(this.QRCodeB){
this.QRCodeB.makeCode(data)
}else{
this.QRCodeB = new QRCode('qrcode', {
width: 80,
height: 80, // 高度
text: data, // 二维码内容
image: ''
});
if(window.location.href.indexOf('groupId')>-1){
query.groupId = this.$route.query.groupId;
}
if(window.location.href.indexOf('invite_code')> -1) {
query.invite_code = this.$route.query.invite_code;
}
this.$router.push({name:'activity',query:query})
},
// 分享
enableShare: function(option) {
let that = this;
getwechatParam({
......@@ -319,7 +370,6 @@
})
})
},
// 处理invite_code
handleInviteCode(){
if(!this.invite_code){
this.this_code = 'CC-USER-'+this.user_id;
......@@ -444,50 +494,11 @@
});
},
groupPay(type){
if(this.payFlag){
this.payFlag=false;
let query = {shopId: this.shopId,invite_code:this.invite_code};
let buyType
if(this.groupId){
query.group_order_id = this.groupId
}
if(type === 0 && !this.groupId){
query.type='single';
buyType = 'single';
}else if (type === 0 && this.groupId){
this.$router.push({
name: 'buyDetail',
query:{
shopId:this.shopId,
invite_code:this.invite_code
}
});
window.location.reload();
return false
} else{
query.type=''
}
let invite = this.invite_code;
this.$sa.track('buyCourse',{
buyType:this.groupDetail.goods_type === 2 && buyType !== 'single' ? '团购' : '直购',
goodsID:this.shopId,
salesType:invite?invite.split('-')[1]:'null',
salesID:invite?Number(invite.split('-')[2]):0
});
if(window.location.href.indexOf('gdt_vid')>-1){
query.gdt_vid = this.$route.query.gdt_vid
}
if(window.location.href.indexOf('cct_user_id')>-1){
query.cct_user_id = this.$route.query.cct_user_id
}
this.$router.push({
name: 'buy',
query:query
});
this.$nextTick(()=>{
this.payFlag=true;
});
if(!JSON.parse(localStorage.getItem('userDesc')).mobile|| JSON.parse(localStorage.getItem('userDesc')).mobile === ''){
this.bindMobile.show = true
}else{
this.buyType = type;
this.goToBuyPage();
}
}
}
......@@ -563,6 +574,50 @@
padding-bottom: toVw(150);
background: #f0f0f0;
font-family: PingFangSC-Regular;
.bindMobile-block.mint-popup{
border-radius: 0;
width: 100%;
font-size:14*@toVw;
background: transparent;
/deep/ .mint-cell-text{
font-size: 14*@toVw;
}
/deep/ .mint-field-core{
font-size: 14*@toVw;
}
.codeMsg{
border-radius:100*@toVw;
border:1*@toVw solid rgba(96,173,240,1);
background: white;
font-size: 12*@toVw;
color: rgb(96,173,240);
outline: none;
float: right;
padding: 4*@toVw 10*@toVw;
&.disabled{
opacity: 0.5;
}
}
.bindMobile-main{
background: white;
position: relative;
margin-top: 50*@toVw;
.header{
width: 70*@toVw;
top: -30*@toVw;
left: 15*@toVw;
height: 70*@toVw;
position: absolute;
}
.title{
padding-left: 95*@toVw;
padding-top: 5*@toVw;
font-family:PingFang-SC-Bold;
font-weight:bold;
}
}
}
.ref-icon{
position: fixed;
height: 100/375 * 90vw ;
......@@ -776,5 +831,4 @@
}
}
}
</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