Commit 7ad5b8e0 authored by IvyXia123's avatar IvyXia123

支付提交

parent 273b5e26
......@@ -11,4 +11,4 @@
position: fixed;
background: #f4f4f4;
}
/* html{font-size: 1px;} */</style><link href=static/css/app.f983055a19b69eb54137ee36031e8a72.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.d935f1deaafc776b0487.js></script><script type=text/javascript src=static/js/vendor.0c1d6ebbba685002d59c.js></script><script type=text/javascript src=static/js/app.c2f1a60bb847b70749cd.js></script></body></html>
\ No newline at end of file
/* html{font-size: 1px;} */</style><link href=static/css/app.f983055a19b69eb54137ee36031e8a72.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.3f3180d025f5798d7194.js></script><script type=text/javascript src=static/js/vendor.0c1d6ebbba685002d59c.js></script><script type=text/javascript src=static/js/app.c2f1a60bb847b70749cd.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.
!function(e){var c=window.webpackJsonp;window.webpackJsonp=function(f,d,n){for(var r,t,o,i=0,u=[];i<f.length;i++)t=f[i],a[t]&&u.push(a[t][0]),a[t]=0;for(r in d)Object.prototype.hasOwnProperty.call(d,r)&&(e[r]=d[r]);for(c&&c(f,d,n);u.length;)u.shift()();if(n)for(i=0;i<n.length;i++)o=b(b.s=n[i]);return o};var f={},a={69:0};function b(c){if(f[c])return f[c].exports;var a=f[c]={i:c,l:!1,exports:{}};return e[c].call(a.exports,a,a.exports,b),a.l=!0,a.exports}b.e=function(e){var c=a[e];if(0===c)return new Promise(function(e){e()});if(c)return c[2];var f=new Promise(function(f,b){c=a[e]=[f,b]});c[2]=f;var d=document.getElementsByTagName("head")[0],n=document.createElement("script");n.type="text/javascript",n.charset="utf-8",n.async=!0,n.timeout=12e4,n.crossOrigin="anonymous",b.nc&&n.setAttribute("nonce",b.nc),n.src=b.p+"static/js/"+({0:"vendor-async"}[e]||e)+"."+{0:"b3bc8f9f5447ad6c3f53",1:"36c3fbbdd1abfa0795f1",2:"b2308e3de2dec2c41dfc",3:"c0da7088c888c638d99a",4:"e036a40ec5493a2f1fe2",5:"d067c99fb3341c9f8fbf",6:"c38f2b63db9838696563",7:"ab7b22280e4c9b350c6e",8:"0034cdf6dcb7e5fdbe75",9:"72f50e7e8acc8e06c50a",10:"56f5b2c85ed51553385d",11:"6782cf75bb172f80d171",12:"c32793ec9c026ec4952c",13:"70e18470ba94e66ea636",14:"6f775b0f71ab907bf6c9",15:"aac97eac9185f386543e",16:"f41b28ff6bf3de8fc15a",17:"202ef012d70503034c38",18:"17bf5166834bef806a2a",19:"d817a9478a0f0f630c7c",20:"6b595c29e6aaaa7f14c1",21:"0c5886bf7427b7b183e7",22:"f68ea2c665fa37420ccb",23:"6027e15d466465201cf5",24:"66115b335ef36e664560",25:"386d0c50933db7378564",26:"926af732471739d5ee45",27:"8ee0be7fbb0fb087db54",28:"57ab508e80608a7ae6bf",29:"cb0ee5d9d72b28fe276f",30:"653c91ab86838e75b5e6",31:"496a4f1feee35020b28e",32:"d416f9c3eb225c407945",33:"ac86ed186ec22ef8a2f0",34:"f9100b504f7ad9f03fb7",35:"4c83dac57ccdccaca4a1",36:"d1457d79c6cca0e5dea3",37:"5f1924cd6103ee117c61",38:"e023144fad02fb9afd5b",39:"78faf4e875e58ebc2e45",40:"ff3778361e9c6e46fe3d",41:"5460cec8b4bef019ce1b",42:"98f43f4674c3dbc018a6",43:"141f3e876e053113ae40",44:"912133dc7b31ecc11d27",45:"ba6206c8ebb8afc0ddf2",46:"f34412903dee9d902d97",47:"7e2de6f7607c9787f0ba",48:"a0f24071ee52a1d66406",49:"27d4731c146b0a03ef7c",50:"6e6cb7cc07cab9d9a18f",51:"9f76654b0cf55d63f8f1",52:"8cb8dad12210101cff85",53:"61c7cab49a9aadefac52",54:"6b792ec4a32901312c88",55:"c9a9e874de578f6a5aea",56:"8845249be04a11188470",57:"b67ef26e643ad0236ccf",58:"28b8eef9ef51c988ac99",59:"7a2bfa03e6fa3d7678c8",60:"2ff38cdcb0c8d13b51a0",61:"4bbe8d73fb4886ec560b",62:"05895947738105c18151",63:"ff2ed96474562cd5e44b",64:"caf94f2c30470c5b5010",65:"2e668d5dbdd605394d27",66:"d29a08ade6bda9eed6a6"}[e]+".js";var r=setTimeout(t,12e4);function t(){n.onerror=n.onload=null,clearTimeout(r);var c=a[e];0!==c&&(c&&c[1](new Error("Loading chunk "+e+" failed.")),a[e]=void 0)}return n.onerror=n.onload=t,d.appendChild(n),f},b.m=e,b.c=f,b.d=function(e,c,f){b.o(e,c)||Object.defineProperty(e,c,{configurable:!1,enumerable:!0,get:f})},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 c=window.webpackJsonp;window.webpackJsonp=function(f,b,n){for(var r,t,o,i=0,u=[];i<f.length;i++)t=f[i],a[t]&&u.push(a[t][0]),a[t]=0;for(r in b)Object.prototype.hasOwnProperty.call(b,r)&&(e[r]=b[r]);for(c&&c(f,b,n);u.length;)u.shift()();if(n)for(i=0;i<n.length;i++)o=d(d.s=n[i]);return o};var f={},a={69:0};function d(c){if(f[c])return f[c].exports;var a=f[c]={i:c,l:!1,exports:{}};return e[c].call(a.exports,a,a.exports,d),a.l=!0,a.exports}d.e=function(e){var c=a[e];if(0===c)return new Promise(function(e){e()});if(c)return c[2];var f=new Promise(function(f,d){c=a[e]=[f,d]});c[2]=f;var b=document.getElementsByTagName("head")[0],n=document.createElement("script");n.type="text/javascript",n.charset="utf-8",n.async=!0,n.timeout=12e4,n.crossOrigin="anonymous",d.nc&&n.setAttribute("nonce",d.nc),n.src=d.p+"static/js/"+({0:"vendor-async"}[e]||e)+"."+{0:"b3bc8f9f5447ad6c3f53",1:"36c3fbbdd1abfa0795f1",2:"b2308e3de2dec2c41dfc",3:"c0da7088c888c638d99a",4:"e036a40ec5493a2f1fe2",5:"d067c99fb3341c9f8fbf",6:"c38f2b63db9838696563",7:"ab7b22280e4c9b350c6e",8:"0034cdf6dcb7e5fdbe75",9:"72f50e7e8acc8e06c50a",10:"56f5b2c85ed51553385d",11:"1e0c903348e76b91d730",12:"c32793ec9c026ec4952c",13:"70e18470ba94e66ea636",14:"6f775b0f71ab907bf6c9",15:"aac97eac9185f386543e",16:"f41b28ff6bf3de8fc15a",17:"202ef012d70503034c38",18:"17bf5166834bef806a2a",19:"d817a9478a0f0f630c7c",20:"6b595c29e6aaaa7f14c1",21:"0c5886bf7427b7b183e7",22:"f68ea2c665fa37420ccb",23:"6027e15d466465201cf5",24:"66115b335ef36e664560",25:"386d0c50933db7378564",26:"926af732471739d5ee45",27:"8ee0be7fbb0fb087db54",28:"57ab508e80608a7ae6bf",29:"cb0ee5d9d72b28fe276f",30:"653c91ab86838e75b5e6",31:"496a4f1feee35020b28e",32:"d416f9c3eb225c407945",33:"ac86ed186ec22ef8a2f0",34:"f9100b504f7ad9f03fb7",35:"4c83dac57ccdccaca4a1",36:"d1457d79c6cca0e5dea3",37:"5f1924cd6103ee117c61",38:"e023144fad02fb9afd5b",39:"78faf4e875e58ebc2e45",40:"ff3778361e9c6e46fe3d",41:"5460cec8b4bef019ce1b",42:"98f43f4674c3dbc018a6",43:"141f3e876e053113ae40",44:"912133dc7b31ecc11d27",45:"ba6206c8ebb8afc0ddf2",46:"f34412903dee9d902d97",47:"7e2de6f7607c9787f0ba",48:"a0f24071ee52a1d66406",49:"27d4731c146b0a03ef7c",50:"6e6cb7cc07cab9d9a18f",51:"9f76654b0cf55d63f8f1",52:"8cb8dad12210101cff85",53:"61c7cab49a9aadefac52",54:"6b792ec4a32901312c88",55:"c9a9e874de578f6a5aea",56:"8845249be04a11188470",57:"b67ef26e643ad0236ccf",58:"28b8eef9ef51c988ac99",59:"7a2bfa03e6fa3d7678c8",60:"2ff38cdcb0c8d13b51a0",61:"4bbe8d73fb4886ec560b",62:"05895947738105c18151",63:"ff2ed96474562cd5e44b",64:"caf94f2c30470c5b5010",65:"2e668d5dbdd605394d27",66:"d29a08ade6bda9eed6a6"}[e]+".js";var r=setTimeout(t,12e4);function t(){n.onerror=n.onload=null,clearTimeout(r);var c=a[e];0!==c&&(c&&c[1](new Error("Loading chunk "+e+" failed.")),a[e]=void 0)}return n.onerror=n.onload=t,b.appendChild(n),f},d.m=e,d.c=f,d.d=function(e,c,f){d.o(e,c)||Object.defineProperty(e,c,{configurable:!1,enumerable:!0,get:f})},d.n=function(e){var c=e&&e.__esModule?function(){return e.default}:function(){return e};return d.d(c,"a",c),c},d.o=function(e,c){return Object.prototype.hasOwnProperty.call(e,c)},d.p="",d.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
......@@ -198,160 +198,160 @@
@goToBuyPage="goToBuyPage"
></login-page>
<order-cancel-dialog
v-if="orderCancel"
:orderCancel='orderCancel'
@cancel='orderCancel=false'
@payEven='goToBuyPage'>
v-if="orderCancel"
:orderCancel='orderCancel'
@cancel='orderCancel=false'
@payEven='goToBuyPage'>
</order-cancel-dialog>
</div>
</template>
<script>
import "swiper/dist/css/swiper.css";
import { swiper, swiperSlide } from "vue-awesome-swiper";
import { Popup } from "mint-ui";
import comment from "../../util/common";
import { Toast } from "vant";
import orderCancelDialog from "./orderCancelDialog";
import {
getwechatParam,
getGoodsDetailApi,
getPassGoodInfoApi,
bindMobileApi,
getUserDetailApi,
sendMobileCodeApi,
getGroupDetailApi,
getStatusWechatApi,
payApi,
getCouponListApi,
getAutomationCouponApi,
getInvitedCouponApi,
getReceiveCouponApi
} 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 loginPage from "./login";
import closeUrl from "../../assets/closemy.png";
import refIcon from "../../assets/refIcon.png";
import couponBtn from "../../assets/activity/btn@2x.png";
import couponBg from "../../assets/activity/popup@2x.png";
import closeImg from "../../assets/activity/close.png";
import couponTip from "../../assets/activity/popup_btn.png";
export default {
name: "index",
components: {
swiper,
swiperSlide,
loginPage,
[Popup.name]: Popup,
orderCancelDialog
},
data() {
return {
orderCancel:false,
refBg: refBg,
bindMobile: {
show: false,
mobile: "",
img_code: "",
verify_code: "",
flag: false
},
join: false,
popType: false,
popFill: false,
popupVisible: false,
refVisible: false,
tabType: true,
popcontentW: `您已经购买过课程,无需重复<br>购买,您可以添加微信公众号了解更多`,
popcontentT: `为了更好地为您进行课程服务,<br>请扫码添加老师二维码`,
qrCode: weChatQrUrl,
weChatIcon: weChatIcon,
closeUrl: closeUrl,
moreUrl: moreUrl,
refIcon: refIcon,
swiperOption: {
pagination: {
el: ".swiper-pagination"
}
},
QRCodeB: false,
payFlag: true,
dataURL: null,
user_id: null,
invite_code_f: true,
invite_code: "",
this_code: "",
shopId: "",
buyType: "",
groupId: null,
groupDetail: false,
groupData: null,
couponInfo: {},
couponShadow: false,
groupSuc: "",
couponBg: couponBg,
couponBtn: couponBtn,
couponPopup: false,
shareName: this.$route.query.nickname,
closeImg: closeImg,
couponTipImg: couponTip,
closeStatus: false,
saleObj:null
};
},
mounted() {
console.log(comment.getUrlParam().gdt_vid, 989898)
this.getDetail();
Toast.loading({
mask: true,
message: ''
});
import "swiper/dist/css/swiper.css";
import { swiper, swiperSlide } from "vue-awesome-swiper";
import { Popup } from "mint-ui";
import comment from "../../util/common";
import { Toast } from "vant";
import orderCancelDialog from "./orderCancelDialog";
import {
getwechatParam,
getGoodsDetailApi,
getPassGoodInfoApi,
bindMobileApi,
getUserDetailApi,
sendMobileCodeApi,
getGroupDetailApi,
getStatusWechatApi,
payApi,
getCouponListApi,
getAutomationCouponApi,
getInvitedCouponApi,
getReceiveCouponApi
} 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 loginPage from "./login";
import closeUrl from "../../assets/closemy.png";
import refIcon from "../../assets/refIcon.png";
import couponBtn from "../../assets/activity/btn@2x.png";
import couponBg from "../../assets/activity/popup@2x.png";
import closeImg from "../../assets/activity/close.png";
import couponTip from "../../assets/activity/popup_btn.png";
export default {
name: "index",
components: {
swiper,
swiperSlide,
loginPage,
[Popup.name]: Popup,
orderCancelDialog
},
data() {
return {
orderCancel:false,
refBg: refBg,
bindMobile: {
show: false,
mobile: "",
img_code: "",
verify_code: "",
flag: false
},
join: false,
popType: false,
popFill: false,
popupVisible: false,
refVisible: false,
tabType: true,
popcontentW: `您已经购买过课程,无需重复<br>购买,您可以添加微信公众号了解更多`,
popcontentT: `为了更好地为您进行课程服务,<br>请扫码添加老师二维码`,
qrCode: weChatQrUrl,
weChatIcon: weChatIcon,
closeUrl: closeUrl,
moreUrl: moreUrl,
refIcon: refIcon,
swiperOption: {
pagination: {
el: ".swiper-pagination"
}
},
QRCodeB: false,
payFlag: true,
dataURL: null,
user_id: null,
invite_code_f: true,
invite_code: "",
this_code: "",
shopId: "",
buyType: "",
groupId: null,
groupDetail: false,
groupData: null,
couponInfo: {},
couponShadow: false,
groupSuc: "",
couponBg: couponBg,
couponBtn: couponBtn,
couponPopup: false,
shareName: this.$route.query.nickname,
closeImg: closeImg,
couponTipImg: couponTip,
closeStatus: false,
saleObj:null
};
},
mounted() {
console.log(comment.getUrlParam().gdt_vid, 989898)
this.getDetail();
Toast.loading({
mask: true,
message: ''
});
// document.body.addEventListener('focusout', () => { //软键盘关闭事件
// document.documentElement.scrollTop = 0
// document.body.scrollTop = 0
// console.log("键盘收起")
// })
},
methods: {
clear(){
localStorage.clear()
sessionStorage.clear()
var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
if(keys) {
for(var i = keys.length; i--;)
document.cookie = keys[i] + '=0;expires=' + new Date(0).toUTCString()
// document.body.addEventListener('focusout', () => { //软键盘关闭事件
// document.documentElement.scrollTop = 0
// document.body.scrollTop = 0
// console.log("键盘收起")
// })
},
methods: {
clear(){
localStorage.clear()
sessionStorage.clear()
var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
if(keys) {
for(var i = keys.length; i--;)
document.cookie = keys[i] + '=0;expires=' + new Date(0).toUTCString()
}
Toast("清除成功");
},
getCoupon() {
this.$sa.quick('trackHeatMap',this.$refs.couponBtn)
getReceiveCouponApi(this.$route.query.shopId).then(res => {
this.couponShadow = true;
},
getCoupon() {
this.$sa.quick('trackHeatMap',this.$refs.couponBtn)
getReceiveCouponApi(this.$route.query.shopId).then(res => {
this.couponShadow = true;
this.couponPopup = false;
this.closeStatus = false;
Toast("领取成功");
});
},
closeCouponPop() {
this.couponPopup = false;
this.closeStatus = false;
Toast("领取成功");
});
},
closeCouponPop() {
this.couponPopup = false;
this.closeStatus = true;
// this.refIcon =
// this.
},
goToBuyPage() {
console.log(comment.getUrlParam().gdt_vid, 2222)
if(this.groupDetail.is_real){
this.closeStatus = true;
// this.refIcon =
// this.
},
goToBuyPage() {
console.log(comment.getUrlParam().gdt_vid, 2222)
if(this.groupDetail.is_real){
let query = { shopId: this.shopId, invite_code: this.invite_code };
let invite = this.invite_code;
this.$sa.track("buyCourse", {
buyType:
this.groupDetail.goods_type === 2 && this.buyType === 0
? "团购"
: "直购",
this.groupDetail.goods_type === 2 && this.buyType === 0
? "团购"
: "直购",
goodsID: this.shopId,
salesType: invite ? invite.split("-")[1] : "null",
salesID: invite ? Number(invite.split("-")[2]) : 0,
......@@ -384,12 +384,15 @@ export default {
} else {
query.type = "";
}
if(window.localStorage.gdt_vid!="undefined"){
json.gdt_vid = window.localStorage.gdt_vid
}
if(window.localStorage.cct_user_id!="undefined"){
json.cct_user_id = window.localStorage.gdt_vid
}
if (localStorage.getItem("gdt_vid")) {
query.gdt_vid = localStorage.getItem("gdt_vid");
}
if (window.location.href.indexOf("cct_user_id") > -1) {
// console.log(comment.getParamhref())
// console.log(comment.getUrlParam())
query.cct_user_id = comment.getParamhref().cct_user_id;
}
console.log(comment.getParamhref(), 76);
this.$sa.track("buyCourse", {
......@@ -413,9 +416,9 @@ export default {
this.$nextTick(() => {
this.payFlag = true;
});
}else{
}else{
let json={
let json={
goods_id:Number(this.shopId)
};
if(this.groupDetail.goods_type === 2 && !this.type){
......@@ -442,13 +445,13 @@ export default {
cct_user_id: localStorage.getItem("cct_user_id"),
redeem_code: localStorage.getItem("redeem_code"),
});
console.log(window.localStorage.gdt_vid);
if(window.localStorage.gdt_vid!="undefined"){
json.gdt_vid = window.localStorage.gdt_vid
}
if(window.localStorage.cct_user_id!="undefined"){
json.cct_user_id = window.localStorage.gdt_vid
}
console.log(window.localStorage.gdt_vid);
if(window.localStorage.gdt_vid!="undefined"){
json.gdt_vid = window.localStorage.gdt_vid
}
if(window.localStorage.cct_user_id!="undefined"){
json.cct_user_id = window.localStorage.gdt_vid
}
this.orderFlag = false;
payApi(json).then(res=>{
......@@ -485,252 +488,319 @@ export default {
// alert(res)
this.orderFlag = true;
})
}
},
jsApiCall: function () {
}
},
jsApiCall: function () {
let that = this;
WeixinJSBridge.invoke(
'getBrandWCPayRequest',
this.jsApiParameters,
function (res) {
that.orderFlag = true;
if (res.err_msg === 'get_brand_wcpay_request:ok') {
// 支付成功后处理
Toast('支付成功');
if(that.groupDetail.goods_type === 2 && !that.type){
setTimeout(function () {
that.$router.push({name:'success',query:{out_trade_no:that.orderNo,invite_code:that.invite_code, shopId: that.shopId}});
},1000)
}else if(that.groupDetail.goods_type === 4){
setTimeout(function () {
that.$router.push({name:'saleSuccess',query:{out_trade_no:that.orderNo,invite_code:that.invite_code, shopId: that.shopId}});
},1000)
}else{
setTimeout(function () {
that.$router.push({name:'buySuccess',query:{out_trade_no:that.orderNo,invite_code:that.invite_code, shopId: that.shopId}});
},1000)
'getBrandWCPayRequest',
this.jsApiParameters,
function (res) {
that.orderFlag = true;
if (res.err_msg === 'get_brand_wcpay_request:ok') {
// 支付成功后处理
Toast('支付成功');
if(that.groupDetail.goods_type === 2 && !that.type){
setTimeout(function () {
that.$router.push({name:'success',query:{out_trade_no:that.orderNo,invite_code:that.invite_code, shopId: that.shopId}});
},1000)
}else if(that.groupDetail.goods_type === 4){
setTimeout(function () {
that.$router.push({name:'saleSuccess',query:{out_trade_no:that.orderNo,invite_code:that.invite_code, shopId: that.shopId}});
},1000)
}else{
setTimeout(function () {
that.$router.push({name:'buySuccess',query:{out_trade_no:that.orderNo,invite_code:that.invite_code, shopId: that.shopId}});
},1000)
}
}
}
// alert(res.errMsg)
// alert(res.err_msg)
if (res.err_msg === 'get_brand_wcpay_request:fail') {
}
if (res.err_msg === 'get_brand_wcpay_request:cancel') {
that.orderCancel=true
}
})
// alert(res.errMsg)
// alert(res.err_msg)
if (res.err_msg === 'get_brand_wcpay_request:fail') {
}
if (res.err_msg === 'get_brand_wcpay_request:cancel') {
that.orderCancel=true
}
})
},
goToActivity() {
let query = {};
if (window.location.href.indexOf("shopId") > -1) {
query.shopId = this.$route.query.shopId;
}
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({
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() {
console.log("分享成功");
},
cancel: function() {
// alert("失败")
console.log("分享失败");
}
});
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() {},
cancel: function() {}
});
});
});
},
handleInviteCode() {
if (!this.invite_code) {
this.this_code = "CC-USER-" + this.user_id;
} else {
let invite_code = this.invite_code.split("-");
if (
invite_code.length > 2 &&
(invite_code[1] === "TEACHER" || invite_code[1] === "XXMM")
) {
invite_code[1] = "USER";
goToActivity() {
let query = {};
if (window.location.href.indexOf("shopId") > -1) {
query.shopId = this.$route.query.shopId;
}
let code = `${invite_code[0]}-${invite_code[1]}`;
this.this_code = `${code}-${this.user_id}`;
}
},
onShare: function(type) {
this.handleInviteCode();
let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${this.this_code}`;
this.enableShare({
product_title: this.groupDetail.share_desc.title,
desc: this.groupDetail.share_desc.content,
shareIcon: this.groupDetail.share_desc.img[0].url,
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();
},
// 初始化
getDetail() {
if (window.location.href.indexOf("invite_code") > -1) {
this.invite_code = this.$route.query.invite_code;
let l = this.invite_code.split("-").length;
if (l === 2) {
this.invite_code_f = false;
if (window.location.href.indexOf("groupId") > -1) {
query.groupId = this.$route.query.groupId;
}
}
// if(window.location.href.indexOf('gdt_vid')> -1){
// comment.getUrlParam().gdt_vid
// console.log(comment.getUrlParam().gdt_vid)
// }
if (this.$route.query.invite_code) {
this.invite_code = this.$route.query.invite_code;
}
// this.user_id = JSON.parse(localStorage.getItem("userDesc")).user_id;
if (window.location.href.indexOf("shopId") > -1) {
this.shopId = this.$route.query.shopId;
getPassGoodInfoApi(this.shopId).then(res => {
res.desc = JSON.parse(res.desc);
res.goods_desc = JSON.parse(res.goods_desc);
res.share_desc = JSON.parse(res.share_desc);
//商品下架跳转绑定商品
if (res.status === 2 && res.bind_goods_id) {
this.$router.push({
name: "buyDetail",
query: {
shopId: res.bind_goods_id,
invite_code: this.invite_code
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({
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() {
console.log("分享成功");
},
cancel: function() {
// alert("失败")
console.log("分享失败");
}
});
this.getDetail();
return;
}
Toast.clear()
this.groupDetail = res;
sessionStorage.setItem('groupDetail', res)
this.groupDetail.desc.detail = comment.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
].replace("http://", "https://");
}
this.groupDetail.desc.detail = this.groupDetail.desc.detail.replace(
/http:\/\//g,
"https://"
);
this.groupDetail.desc.qa = this.groupDetail.desc.qa.replace(
/http:\/\//g,
"https://"
);
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() {},
cancel: function() {}
});
});
});
},
handleInviteCode() {
if (!this.invite_code) {
this.this_code = "CC-USER-" + this.user_id;
} else {
let invite_code = this.invite_code.split("-");
if (
this.groupDetail.share_desc.refImg &&
this.groupDetail.share_desc.refImg.length === 1
invite_code.length > 2 &&
(invite_code[1] === "TEACHER" || invite_code[1] === "XXMM")
) {
this.groupDetail.share_desc.refImg[0].url = this.groupDetail.share_desc.refImg[0].url.replace(
"http://",
"https://"
);
let _this = this;
this.toDataURLBase64(
this.groupDetail.share_desc.refImg[0].url,
function(avatarUrl) {
_this.groupDetail.share_desc.refImg[0].url = avatarUrl;
}
);
invite_code[1] = "USER";
}
let invite = this.invite_code;
this.$sa.track("viewCourseDetail190726", {
goodsID: this.groupDetail.id.toString(),
courseCate:
this.groupDetail.course_type === 1 ? "体验课" : "正式课",
lessonNumber: this.groupDetail.watch_num,
goodsName: this.groupDetail.name,
coursePrice: Number(this.groupDetail.original_price / 100),
discountPrice: Number(this.groupDetail.current_price / 100),
courseID: this.groupDetail.course_id,
courseName: "",
salesType: invite ? invite.split("-")[1] : "null",
salesID: invite ? Number(invite.split("-")[2]) : 0
});
if (this.groupDetail.goods_type === 2) {
if (localStorage.getItem("cc_token")) {
getStatusWechatApi({ goods_id: this.shopId }).then(res => {
if (res.out_trade_no) {
if (res.buy_type === 1) {
this.$router.push({
name: "buySuccess",
query: { out_trade_no: res.out_trade_no, shopId: this.shopId }
});
} else {
this.$router.push({
name: "success",
query: { out_trade_no: res.out_trade_no, shopId: this.shopId }
});
}
let code = `${invite_code[0]}-${invite_code[1]}`;
this.this_code = `${code}-${this.user_id}`;
}
},
onShare: function(type) {
this.handleInviteCode();
let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${this.this_code}`;
this.enableShare({
product_title: this.groupDetail.share_desc.title,
desc: this.groupDetail.share_desc.content,
shareIcon: this.groupDetail.share_desc.img[0].url,
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();
},
// 初始化
getDetail() {
if (window.location.href.indexOf("invite_code") > -1) {
this.invite_code = this.$route.query.invite_code;
let l = this.invite_code.split("-").length;
if (l === 2) {
this.invite_code_f = false;
}
}
// if(window.location.href.indexOf('gdt_vid')> -1){
// comment.getUrlParam().gdt_vid
// console.log(comment.getUrlParam().gdt_vid)
// }
if (this.$route.query.invite_code) {
this.invite_code = this.$route.query.invite_code;
}
// this.user_id = JSON.parse(localStorage.getItem("userDesc")).user_id;
if (window.location.href.indexOf("shopId") > -1) {
this.shopId = this.$route.query.shopId;
getPassGoodInfoApi(this.shopId).then(res => {
res.desc = JSON.parse(res.desc);
res.goods_desc = JSON.parse(res.goods_desc);
res.share_desc = JSON.parse(res.share_desc);
//商品下架跳转绑定商品
if (res.status === 2 && res.bind_goods_id) {
this.$router.push({
name: "buyDetail",
query: {
shopId: res.bind_goods_id,
invite_code: this.invite_code
}
});
this.getDetail();
return;
}
if (window.location.href.indexOf("groupId") > -1) {
this.groupId = this.$route.query.groupId;
getGroupDetailApi(this.groupId).then(res => {
this.groupData = res;
});
this.onShare(0);
Toast.clear()
this.groupDetail = res;
sessionStorage.setItem('groupDetail', res)
this.groupDetail.desc.detail = comment.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
].replace("http://", "https://");
}
this.groupDetail.desc.detail = this.groupDetail.desc.detail.replace(
/http:\/\//g,
"https://"
);
this.groupDetail.desc.qa = this.groupDetail.desc.qa.replace(
/http:\/\//g,
"https://"
);
if (
this.groupDetail.share_desc.refImg &&
this.groupDetail.share_desc.refImg.length === 1
) {
this.groupDetail.share_desc.refImg[0].url = this.groupDetail.share_desc.refImg[0].url.replace(
"http://",
"https://"
);
let _this = this;
this.toDataURLBase64(
this.groupDetail.share_desc.refImg[0].url,
function(avatarUrl) {
_this.groupDetail.share_desc.refImg[0].url = avatarUrl;
}
);
}
let invite = this.invite_code;
this.$sa.track("viewCourseDetail190726", {
goodsID: this.groupDetail.id.toString(),
courseCate:
this.groupDetail.course_type === 1 ? "体验课" : "正式课",
lessonNumber: this.groupDetail.watch_num,
goodsName: this.groupDetail.name,
coursePrice: Number(this.groupDetail.original_price / 100),
discountPrice: Number(this.groupDetail.current_price / 100),
courseID: this.groupDetail.course_id,
courseName: "",
salesType: invite ? invite.split("-")[1] : "null",
salesID: invite ? Number(invite.split("-")[2]) : 0
});
if (this.groupDetail.goods_type === 2) {
if (localStorage.getItem("cc_token")) {
getStatusWechatApi({ goods_id: this.shopId }).then(res => {
if (res.out_trade_no) {
if (res.buy_type === 1) {
this.$router.push({
name: "buySuccess",
query: { out_trade_no: res.out_trade_no, shopId: this.shopId }
});
} else {
this.$router.push({
name: "success",
query: { out_trade_no: res.out_trade_no, shopId: this.shopId }
});
}
}
});
}
if (window.location.href.indexOf("groupId") > -1) {
this.groupId = this.$route.query.groupId;
getGroupDetailApi(this.groupId).then(res => {
this.groupData = res;
});
this.onShare(0);
} else {
this.onShare(1);
}
} else {
this.onShare(1);
this.handleInviteCode();
}
} else {
this.onShare(1);
this.handleInviteCode();
}
if(sessionStorage.getItem('clickTag')){
console.log(JSON.parse(localStorage.getItem("userDesc")))
if(sessionStorage.getItem('clickTag')){
console.log(JSON.parse(localStorage.getItem("userDesc")))
if (!JSON.parse(localStorage.getItem("userDesc")).mobile || JSON.parse(localStorage.getItem("userDesc")).mobile === "") {
this.bindMobile.flag = sessionStorage.getItem('type');
this.bindMobile.show = true;
setTimeout(() => {
this.$sa.track("ViewRegisterpage", {});
}, 1000);
} else {
this.goToBuyPage();
}
sessionStorage.setItem('clickTag','')
}
// getInvitedCouponApi(this.$route.query.shopId).then(res => {
// if (res.code && res.code == 100) {
// if (res.data.flag == 0) {
// this.couponShadow = true;
// this.couponInfo.money = res.data.original_price;
// console.log(this.couponInfo);
// }
// } else if (this.$route.query.invite_code&&this.groupDetail.is_auth_user==1) {
// this.couponInfo = res;
// this.couponInfo.money = res.original_price;
// this.couponPopup = true;
// this.$sa.track('ViewShareCouponWindow',{});
// // res.original_price
// }
// });
});
}
let userCourse = JSON.parse(localStorage.getItem("userCourse"));
if (userCourse && !userCourse.periods_list) {
// 优惠券
getCouponListApi(this.$route.query.shopId).then(res => {
if (res.length) {
this.couponInfo = res[0];
this.couponShadow = true;
}
console.log(this.couponInfo);
});
}
},
showTeacher() {
this.popType = false;
this.popupVisible = true;
},
buttonClick(buttonType, buttonName) {
this.$sa.track("buttonClick", {
tabTitle: "商品",
moduleTitle: "详情页",
buttonType: buttonType,
buttonName: buttonName,
});
},
groupPay(type, status) {
if (status) {
this.groupSuc = status;
// console.log(status)
}
if(!localStorage.getItem("userDesc")){
sessionStorage.setItem('clickTag',1)
sessionStorage.setItem('type',type)
this.$sa.track("ViewWechatWindow", {
});
getUserDetailApi().then(res => {
// debugger
localStorage.setItem('userDesc', JSON.stringify(res));
if (!JSON.parse(localStorage.getItem("userDesc")).mobile || JSON.parse(localStorage.getItem("userDesc")).mobile === "") {
this.bindMobile.flag = sessionStorage.getItem('type');
this.bindMobile.flag = type;
this.bindMobile.show = true;
setTimeout(() => {
this.$sa.track("ViewRegisterpage", {});
......@@ -738,76 +808,9 @@ export default {
} else {
this.goToBuyPage();
}
sessionStorage.setItem('clickTag','')
}
// getInvitedCouponApi(this.$route.query.shopId).then(res => {
// if (res.code && res.code == 100) {
// if (res.data.flag == 0) {
// this.couponShadow = true;
// this.couponInfo.money = res.data.original_price;
// console.log(this.couponInfo);
// }
// } else if (this.$route.query.invite_code&&this.groupDetail.is_auth_user==1) {
// this.couponInfo = res;
// this.couponInfo.money = res.original_price;
// this.couponPopup = true;
// this.$sa.track('ViewShareCouponWindow',{});
// // res.original_price
// }
// });
});
}
let userCourse = JSON.parse(localStorage.getItem("userCourse"));
if (userCourse && !userCourse.periods_list) {
// 优惠券
getCouponListApi(this.$route.query.shopId).then(res => {
if (res.length) {
this.couponInfo = res[0];
this.couponShadow = true;
}
console.log(this.couponInfo);
});
}
},
showTeacher() {
this.popType = false;
this.popupVisible = true;
},
buttonClick(buttonType, buttonName) {
this.$sa.track("buttonClick", {
tabTitle: "商品",
moduleTitle: "详情页",
buttonType: buttonType,
buttonName: buttonName,
});
},
groupPay(type, status) {
if (status) {
this.groupSuc = status;
// console.log(status)
}
if(!localStorage.getItem("userDesc")){
sessionStorage.setItem('clickTag',1)
sessionStorage.setItem('type',type)
this.$sa.track("ViewWechatWindow", {
}).catch((res) => {
});
getUserDetailApi().then(res => {
// debugger
localStorage.setItem('userDesc', JSON.stringify(res));
if (!JSON.parse(localStorage.getItem("userDesc")).mobile || JSON.parse(localStorage.getItem("userDesc")).mobile === "") {
this.bindMobile.flag = type;
this.bindMobile.show = true;
setTimeout(() => {
this.$sa.track("ViewRegisterpage", {});
}, 1000);
} else {
this.goToBuyPage();
}
}).catch((res) => {
});
}else{
}else{
if (!JSON.parse(localStorage.getItem("userDesc")).mobile || JSON.parse(localStorage.getItem("userDesc")).mobile === "") {
this.bindMobile.flag = type;
this.bindMobile.show = true;
......@@ -817,338 +820,338 @@ export default {
} else {
this.goToBuyPage();
}
}
}
}
}
}
};
};
</script>
<style>
img,
video {
max-width: 100%;
}
@-webkit-keyframes swing {
10% {
transform: rotate(15deg);
img,
video {
max-width: 100%;
}
20% {
transform: rotate(-10deg);
}
30% {
transform: rotate(5deg);
}
40% {
transform: rotate(-5deg);
@-webkit-keyframes swing {
10% {
transform: rotate(15deg);
}
20% {
transform: rotate(-10deg);
}
30% {
transform: rotate(5deg);
}
40% {
transform: rotate(-5deg);
}
50%,
100% {
transform: rotate(0deg);
}
}
50%,
100% {
transform: rotate(0deg);
.shake {
-webkit-animation-name: swing;
-webkit-animation-duration: 0.8s;
-webkit-transform-origin: 50% 50%;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
}
.shake {
-webkit-animation-name: swing;
-webkit-animation-duration: 0.8s;
-webkit-transform-origin: 50% 50%;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
</style>
<style scoped lang="less">
@import "../../util/public";
.child-view {
// position: relative;
}
.couponPop {
background: transparent;
.box {
width: 319 * @toVw;
.bg {
width: 100%;
}
.content {
position: absolute;
top: 170 * @toVw;
padding: 0 40 * @toVw;
p {
color: #ffefa8;
font-size: 22 * @toVw;
@import "../../util/public";
.child-view {
// position: relative;
}
.couponPop {
background: transparent;
.box {
width: 319 * @toVw;
.bg {
width: 100%;
}
.btn {
margin-top: 150 * @toVw;
.content {
position: absolute;
top: 170 * @toVw;
padding: 0 40 * @toVw;
p {
color: #ffefa8;
font-size: 22 * @toVw;
}
.btn {
margin-top: 150 * @toVw;
}
.name{display: inline-block;max-width: 90 * @toVw;vertical-align: bottom;
overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
}
.closeImg {
position: absolute;
top: -26 * @toVw;
right: 10 * @toVw;
width: 27 * @toVw;
}
.name{display: inline-block;max-width: 90 * @toVw;vertical-align: bottom;
overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
}
.closeImg {
position: absolute;
top: -26 * @toVw;
right: 10 * @toVw;
width: 27 * @toVw;
}
}
}
.img-cvs {
position: absolute;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
.qrcode {
.img-cvs {
position: absolute;
top: 305 * @toVw;
left: 15 * @toVw;
width: 60 * @toVw;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
.qrcode {
position: absolute;
top: 305 * @toVw;
left: 15 * @toVw;
width: 60 * @toVw;
}
}
}
.cvs-img {
position: absolute;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
z-index: 10;
}
.ref-content {
width: 299 * @toVw;
height: 564 * @toVw;
background-size: 100% 100%;
position: relative;
.tips {
font-size: 12px;
.cvs-img {
position: absolute;
color: #666;
right: 10 * @toVw;
top: 250 * @toVw;
width: 1em;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
z-index: 10;
}
}
.group-index {
z-index: 2;
padding-bottom: toVw(150);
background: #f0f0f0;
font-family: PingFangSC-Regular;
.ref-icon {
position: fixed;
height: 100/375 * 90vw;
top: 70vw;
z-index: 6;
right: 10 * 100 /375vw;
}
.banner {
background: white;
img {
width: 100%;
.ref-content {
width: 299 * @toVw;
height: 564 * @toVw;
background-size: 100% 100%;
position: relative;
.tips {
font-size: 12px;
position: absolute;
color: #666;
right: 10 * @toVw;
top: 250 * @toVw;
width: 1em;
}
}
.head {
background: white;
margin-bottom: 10px;
padding: 20/7.5vw;
.title {
font-size: 20px;
color: #333333;
margin-bottom: 15/7.5vw;
.group-index {
z-index: 2;
padding-bottom: toVw(150);
background: #f0f0f0;
font-family: PingFangSC-Regular;
.ref-icon {
position: fixed;
height: 100/375 * 90vw;
top: 70vw;
z-index: 6;
right: 10 * 100 /375vw;
}
.detail {
font-size: 12px;
line-height: 1.6em;
color: #333333;
display: block;
margin-bottom: 15/7.5vw;
.banner {
background: white;
img {
width: 100%;
}
}
.price {
.price-content {
font-family: PingFang-SC-Bold;
.head {
background: white;
margin-bottom: 10px;
padding: 20/7.5vw;
.title {
font-size: 20px;
color: #f83534;
color: #333333;
margin-bottom: 15/7.5vw;
}
}
}
.head-icon {
padding: 20/7.5vw;
background: white;
margin-bottom: 2px;
.icon {
display: inline-block;
width: 60/7.5vw;
margin: 0 10/7.5vw;
border-radius: 1000px;
vertical-align: middle;
}
.more {
width: 50/7.5vw;
vertical-align: middle;
}
.has {
font-size: 12px;
line-height: 60/7.5vw;
color: #999999;
float: right;
}
}
.welfare {
background: white;
padding: 10/7.5vw;
font-size: 12px;
text-align: center;
color: #999999;
margin-bottom: 20px;
}
.main-detail {
padding: 20/7.5vw;
background: white;
.tab-content {
border-radius: 9px;
border: 1px solid #f63539;
&:after {
content: "";
.detail {
font-size: 12px;
line-height: 1.6em;
color: #333333;
display: block;
clear: both;
margin-bottom: 15/7.5vw;
}
.tab-btn {
width: 50%;
float: left;
height: 80/7.5vw;
line-height: 80/7.5vw;
text-align: center;
color: #f63539;
border-radius: 9px;
&.active {
background: #f63539;
color: white;
.price {
.price-content {
font-family: PingFang-SC-Bold;
font-size: 20px;
color: #f83534;
}
}
}
.qa-block {
padding-bottom: 50 * @toVw;
img,
video {
max-width: 100%;
.head-icon {
padding: 20/7.5vw;
background: white;
margin-bottom: 2px;
.icon {
display: inline-block;
width: 60/7.5vw;
margin: 0 10/7.5vw;
border-radius: 1000px;
vertical-align: middle;
}
.qa-content {
margin: toVw(10) 0;
.qa-q {
font-size: 16px;
color: #666666;
.more {
width: 50/7.5vw;
vertical-align: middle;
}
.has {
font-size: 12px;
line-height: 60/7.5vw;
color: #999999;
float: right;
}
}
.welfare {
background: white;
padding: 10/7.5vw;
font-size: 12px;
text-align: center;
color: #999999;
margin-bottom: 20px;
}
.main-detail {
padding: 20/7.5vw;
background: white;
.tab-content {
border-radius: 9px;
border: 1px solid #f63539;
&:after {
content: "";
display: block;
clear: both;
}
.qa-a {
font-size: 16px;
color: #333333;
.tab-btn {
width: 50%;
float: left;
height: 80/7.5vw;
line-height: 80/7.5vw;
text-align: center;
color: #f63539;
border-radius: 9px;
&.active {
background: #f63539;
color: white;
}
}
}
}
.detail {
padding: 20/7.5vw 0 150/7.5vw 0;
.detail-content {
.qa-block {
padding-bottom: 50 * @toVw;
img,
video {
max-width: 100%;
}
.qa-content {
margin: toVw(10) 0;
.qa-q {
font-size: 16px;
color: #666666;
}
.qa-a {
font-size: 16px;
color: #333333;
}
}
}
}
}
.couponBox {
position: fixed;
width: 100%;
height: 25 * @toVw;
background: #ffe83c;
bottom: 70 * @toVw;
text-align: center;
color: #ff4d4f;
line-height: 25 * @toVw;
font-size: 12px;
}
footer {
position: absolute;
position: fixed;
bottom: 0;
width: 97.7vw;
height: 120/7.5vw;
display: -webkit-box; // OLD - iOS 6-, Safari 3.1-6 //
display: -moz-box; // OLD - Firefox 19- (buggy but mostly works) //
display: -ms-flexbox; // TWEENER - IE 10 //
display: -webkit-flex; // NEW - Chrome //
display: flex; // NEW, Spec - Opera 12.1, Firefox 20+ //
background: white;
padding: 1.3vw;
border-top: 1px solid #d8d8d8;
justify-content: space-around;
.btn {
border: 1px solid #cccccc;
border-radius: 8px;
width: 0;
flex-grow: 2;
text-align: center;
padding: 15/7.5vw 0;
margin: 0 10/7.5vw;
line-height: 1.4em;
font-size: 16px;
color: #666666;
.free {
line-height: 120/9vw;
}
span {
display: block;
font-size: 20px;
font-family: PingFang-SC-Bold;
}
img {
width: 50/7.5vw;
}
&.big {
padding: 5/7.5vw 0;
flex-grow: 5;
&.price {
background: #f83534;
border-color: #f83534;
color: white;
&.full {
background: #dddddd;
border-color: #dddddd;
line-height: 50 * @toVw;
.detail {
padding: 20/7.5vw 0 150/7.5vw 0;
.detail-content {
img,
video {
max-width: 100%;
}
}
}
}
}
.pop-block {
padding: 40/7.5vw 10/7.5vw;
width: 600/7.5vw;
text-align: center;
font-size: 14px;
color: #666666;
position: relative;
img {
width: 250/7.5vw;
.couponBox {
position: fixed;
width: 100%;
height: 25 * @toVw;
background: #ffe83c;
bottom: 70 * @toVw;
text-align: center;
color: #ff4d4f;
line-height: 25 * @toVw;
font-size: 12px;
}
.close {
width: 50/7.5vw;
footer {
position: absolute;
top: 20/7.5vw;
right: 20/7.5vw;
}
}
.pop-fill {
width: 500/7.5vw;
padding: 30/7.5vw 30/7.5vw;
font-size: 16px;
color: #333333;
.btn-block {
margin-top: 30/7.5vw;
&:after {
content: "";
display: block;
clear: both;
}
position: fixed;
bottom: 0;
width: 97.7vw;
height: 120/7.5vw;
display: -webkit-box; // OLD - iOS 6-, Safari 3.1-6 //
display: -moz-box; // OLD - Firefox 19- (buggy but mostly works) //
display: -ms-flexbox; // TWEENER - IE 10 //
display: -webkit-flex; // NEW - Chrome //
display: flex; // NEW, Spec - Opera 12.1, Firefox 20+ //
background: white;
padding: 1.3vw;
border-top: 1px solid #d8d8d8;
justify-content: space-around;
.btn {
float: right;
background: #f83534;
font-size: 14px;
padding: 5/7.5vw 10/7.5vw;
border: 1px solid #cccccc;
border-radius: 8px;
color: #ffffff;
width: 0;
flex-grow: 2;
text-align: center;
padding: 15/7.5vw 0;
margin: 0 10/7.5vw;
line-height: 1.4em;
font-size: 16px;
color: #666666;
.free {
line-height: 120/9vw;
}
span {
display: block;
font-size: 20px;
font-family: PingFang-SC-Bold;
}
img {
width: 50/7.5vw;
}
&.big {
padding: 5/7.5vw 0;
flex-grow: 5;
&.price {
background: #f83534;
border-color: #f83534;
color: white;
&.full {
background: #dddddd;
border-color: #dddddd;
line-height: 50 * @toVw;
}
}
}
}
}
.pop-block {
padding: 40/7.5vw 10/7.5vw;
width: 600/7.5vw;
text-align: center;
font-size: 14px;
color: #666666;
position: relative;
img {
width: 250/7.5vw;
}
.close {
width: 50/7.5vw;
position: absolute;
top: 20/7.5vw;
right: 20/7.5vw;
}
}
.pop-fill {
width: 500/7.5vw;
padding: 30/7.5vw 30/7.5vw;
font-size: 16px;
color: #333333;
.btn-block {
margin-top: 30/7.5vw;
&:after {
content: "";
display: block;
clear: both;
}
.btn {
float: right;
background: #f83534;
font-size: 14px;
padding: 5/7.5vw 10/7.5vw;
border-radius: 8px;
color: #ffffff;
}
}
}
}
}
</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