Commit 416e834f authored by mengcuiguang's avatar mengcuiguang

添加豆弹窗

parent 048de4c4
<template>
<view>
<uni-popup type="bottom" ref="select" :maskClick="false" :isMaskClick="false">
<view class="body">
<scroll-view scroll-y style="height: 80%;">
<view @click="handleClose" style="color: red;">关闭</view>
<view class="section">
<view class="pack-box">
<view class="pack-item" :class="[{active: index==selectedIndex}]"
v-for='(item, index) in vipList' :key='index' @click="choosePack(item, index)">
<view class="name row">
{{item.title}}
</view>
<view class="price row">
{{item.firstPayPrice}}
</view>
<view class="origin row" v-if='item.oldPrice'>
原价:{{item.oldPrice}}
</view>
<view class="cut-down" v-if='item.oldPrice-item.firstPayPrice>0'>
立省 {{item.oldPrice-item.firstPayPrice}}
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</uni-popup>
</view>
</template>
<script>
import common from '@/mixins/common';
export default {
name: 'popup',
mixins: [common],
props: {
show: {
type: Boolean,
default: false
}
},
data() {
return {
vipList: [],
selectedIndex: 0,
showClone: false
};
},
methods: {
handleShow() {
this.$refs.select.open('bottom');
this.post({
url: '/vip/getVipProducts',
showLoading: false,
success: ({
data
}) => {
this.vipList = data.list
}
});
},
handleClose() {
this.$refs.select.close('bottom');
this.$emit('close');
},
choosePack(item, index) {
this.selectedIndex = index;
// this.handlePay();
},
handlePay() {
let that = this;
let vipBean = this.vipList[this.selectedIndex];
this.post({
url: '/vip/getVipPayParams',
data: {
pid: vipBean.pid,
payChannel: 'WEIXIN'
},
showLoading: true,
success: ({
data
}) => {
that.wxPay(data);
}
});
},
wxPay(wxData) {
let wxParams = wxData.params;
let that = this;
// 发起微信支付
wx.requestPayment({
timeStamp: wxParams.timeStamp,
nonceStr: wxParams.nonceStr,
package: wxParams.packageStr,
signType: wxParams.signType,
paySign: wxParams.paySign,
success(res) {
message.notify('支付成功')
// setTimeout(() => {
// navigateTo(`/pages/home`)
// }, 1000);
},
fail(res) {
message.notify('取消支付')
}
})
}
},
watch: {
show: {
handler: function(newVal, oldVal) {
if (newVal) {
this.handleShow();
}
},
immediate: true
}
}
};
</script>
<style lang="scss">
.body {
background-color: white;
display: flex;
flex-direction: column;
position: relative;
.section {
padding: 0 20rpx;
display: flex;
flex-direction: column;
background: #fff;
.title {
font-size: 32rpx;
font-weight: 700;
color: #333;
margin-bottom: 30rpx;
}
.pack-box {
margin-top: 25rpx;
margin-left: 20rpx;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
.active {
border: 6rpx solid #fd5350 !important;
}
.pack-item {
margin-bottom: 25rpx;
margin-right: 20rpx;
width: calc(44%);
height: 200rpx;
display: flex;
flex-direction: column;
justify-content: space-around;
background: #f5f5f5;
border: 6rpx solid #f5f5f5;
border-radius: 10rpx;
position: relative;
.row {
margin: 8rpx 15rpx;
marign-bottom: 0;
}
.row:last-child {
margin-bottom: 8rpx;
}
.name {
font-size: 26rpx;
font-weight: 700;
color: #333;
}
.price {
font-size: 30rpx;
color: #fd5350;
font-weight: 700;
}
.origin {
font-size: 22rpx;
color: #333;
text-decoration: line-through;
}
.cut-down {
position: absolute;
top: 0;
right: 0;
color: #fff;
background: #ff502f;
font-size: 22rpx;
border-radius: 15rpx;
height: 30rpx;
line-height: 30rpx;
padding: 0 10rpx;
transform: translate(0, -50%);
}
}
}
.apply-button {
border-radius: 50rpx;
background: #e8c8ae;
color: #8d5a29;
margin: 30rpx auto;
}
}
}
</style>
\ No newline at end of file
......@@ -8,6 +8,12 @@
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_splash.png" mode="scaleToFill">
</image>
</view>
<uni-popup type="center" ref="select">
<view class="text-box">
{{slotParam}}
</view>
</uni-popup>
</view>
</template>
......@@ -27,14 +33,15 @@
mixins: [common],
data() {
return {
tips1: ''
tips1: '',
slotParam: ''
}
},
onLoad(options) {
this.tips1 = options.tips1;
},
onShow(options) {
// this.wxlogin();
this.wxlogin();
},
methods: {
wxlogin() {
......@@ -53,8 +60,9 @@
var zs_channel = ''; // 自有渠道
var vedio_id = ''; // 自有剧
// 头条渠道参数
// 判断渠道来源
if (obj.query.clue_token ?? '' != '') {
// 头条渠道参数
channel = 'tt'
clueToken = obj.query.clue_token ?? ''
adId = obj.query.ad_id ?? ''
......@@ -66,19 +74,25 @@
product_type = obj.query.product_type ?? ''
zs_channel = obj.query.zs_channel ?? ''
vedio_id = obj.query.vedio_id ?? ''
}
}else if(obj.query.ksChannel ?? '' != ''){
// 快手渠道参数
if (obj.query.ksChannel ?? '' != '') {
channel = 'kuaishou'
advertiserId = obj.query.accountid ?? ''
clueToken = obj.query.callback ?? ''
adId = obj.query.aid ?? ''
tips2 = obj.query.tips2 ?? ''
product_type = obj.query.product_type ?? ''
zs_channel = obj.query.zs_channel ?? ''
vedio_id = obj.query.vedio_id ?? ''
}else{
// 自有渠道
}
// 打印渠道参数
if (this.tips1 == 'mints_vedio' || tips2 == 'mints_vedio') {
toastMessage("param = " + JSON.stringify(obj.query));
this.slotParam = JSON.stringify(obj.query);
this.$refs.select.open('center');
}
uni.login({
......@@ -133,4 +147,12 @@
flex-direction: column;
align-items: center;
}
.text-box {
word-break: break-all;
margin: 10rpx;
padding: 10rpx;
background-color: white;
color: black;
}
</style>
\ No newline at end of file
......@@ -52,6 +52,10 @@
<view style="display: flex;justify-content: center;margin-top: 20rpx;font-size: 26rpx;color: gray;">
{{ versionName }}
</view>
<coin-popup :show="showAnimate" @close="showAnimate = false" >
</coin-popup>
</view>
</template>
......@@ -81,6 +85,7 @@
return {
statusBarHeight: app.globalData.statusBarHeight,
userBean: {},
showAnimate: false,
versionName: app.globalData.versionName
};
},
......@@ -101,13 +106,15 @@
},
handleWatchRecord() {
navigateTo(`/pagesD/watchRecord/watchRecord`)
// navigateTo(`/pagesD/watchRecord/watchRecord`)
this.showAnimate=true;
},
handlePayRecord() {
navigateTo(`/pagesD/payRecord/payRecord`)
},
handleVipPay() {
navigateTo(`/pagesA/vipPay/vipPay`)
},
handlePhone() {
// 联系我们
......
......@@ -152,19 +152,21 @@
}
.pack-box {
margin-top: 25rpx;
margin-left: 40rpx;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
.active {
border: 6rpx solid #fd5350 !important;
}
.pack-item {
margin-bottom: 15rpx;
margin-bottom: 25rpx;
margin-right: 40rpx;
width: calc(33.333333333% - 40rpx);
width: calc(31% - 40rpx);
height: 200rpx;
display: flex;
flex-direction: column;
......@@ -218,10 +220,10 @@
}
.apply-button {
width: 86%;
border-radius: 50rpx;
background: #e8c8ae;
color: #8d5a29;
width: 500rpx;
margin: 30rpx auto;
}
}
......
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