Skip to content

U
uniapp_scan
Commit 5d3145c1 authored by jyx's avatar jyx
Browse files
Options

添加取消订阅

parent 0f59e708
Hide whitespace changes
Inline Side-by-side
Showing with 290 additions and 275 deletions
scan/pagesA/vipPay/vipPay.vue
View file @ 5d3145c1
......@@ -6,38 +6,38 @@
<image style="width: 100%;margin-top: 10rpx;margin-bottom: 10rpx;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg_scan/img/ic_vip_banner.png" mode="widthFix" />
<view class="section">
<view class="pack-box">
<view class="pack-item"
:style="item.largeType =='vip' ?'background: #f5f5f5;':'background: #f4c98b;'"
:class="[{active: index==selectedIndex}]" v-for='(item, index) in vipList'
:key='index' @click="choosePack(item, index)">
<view style="display: flex;flex-direction: column;align-items: center;">
<view class="price row">
{{item.firstPayPrice}}元
</view>
<view class="name row" v-if="item.title!=null&&item.title!=''">
{{item.title}}
</view>
<view class="origin row" v-if="item.remarks!=null&&item.remarks!=''">
{{item.remarks}}
</view>
</view>
<view class="cut-down" v-if='item.topTitle!=null&&item.topTitle.length>0'>
{{item.topTitle}}
</view>
<view v-if="index==selectedIndex" style="position: absolute;bottom: 0;right: 0;">
<image mode="scaleToFill"
style="width: 100rpx;height: 100rpx;display: flex;align-items: right;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_loading.gif">
</image>
</view>
</view>
</view>
<view class="section">
<view class="pack-box">
<view class="pack-item"
:style="item.largeType =='vip' ?'background: #f5f5f5;':'background: #f4c98b;'"
:class="[{active: index==selectedIndex}]" v-for='(item, index) in vipList' :key='index'
@click="choosePack(item, index)">
<view style="display: flex;flex-direction: column;align-items: center;">
<view class="price row">
{{item.firstPayPrice}}元
</view>
<view class="name row" v-if="item.title!=null&&item.title!=''">
{{item.title}}
</view>
<view class="origin row" v-if="item.remarks!=null&&item.remarks!=''">
{{item.remarks}}
</view>
</view>
<view class="cut-down" v-if='item.topTitle!=null&&item.topTitle.length>0'>
{{item.topTitle}}
</view>
<view v-if="index==selectedIndex" style="position: absolute;bottom: 0;right: 0;">
<image mode="scaleToFill"
style="width: 100rpx;height: 100rpx;display: flex;align-items: right;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_loading.gif">
</image>
</view>
</view>
</view>
</view>
<!-- <view v-if="false" class="item-agree">
......@@ -47,10 +47,16 @@
<image style="width:28rpx;height: 28rpx;" v-else @click="clickAgreeBtn" src="@/static/ic_vip_none.png">
</image>
<view style="font-size: 22rpx;margin-left: 10rpx;" @click="clickAgree">点击购买即表示您同意《会员付费协议》</view>
</view> -->
<view class="item-agree">
<view style="font-size: 28rpx;" @click="clickAgree">用户付费须知> </view>
</view> -->
<view class="trialStyle">
<text v-if="hintText">
{{hintText}}
</text>
</view>
<view class="item-agree">
<view style="font-size: 28rpx;" @click="clickAgree">用户付费须知> </view>
</view>
<view class="section">
......@@ -60,17 +66,16 @@
<image @click="handlePay" style="width: 100%;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/bg_vip_about.png" mode="widthFix" />
</scroll-view>
<view>
<uni-popup ref="alertDialog" type="center">
<uni-popup-dialog confirmText="确认" title="付费须知" content="
</scroll-view>
<view>
<uni-popup ref="alertDialog" type="center">
<uni-popup-dialog confirmText="确认" title="付费须知" content="
1、会员属于虚拟商品，一经购买不可退换;
2、未满18岁的未成年人需要在监护人主导、同意下进行相关付费操作;
3、充值会员一般5分钟内到账，如未到账请在“我的”页面咨询客服;"
@close="dialogClose">
</uni-popup-dialog>
</uni-popup>
3、充值会员一般5分钟内到账，如未到账请在“我的”页面咨询客服;" @close="dialogClose">
</uni-popup-dialog>
</uni-popup>
</view>
</view>
</template>
......@@ -93,49 +98,52 @@
return {
vipList: [],
needClick: false,
selectedIndex: 0,
os: 'android'
selectedIndex: 0,
os: 'android',
hintText: ''
}
},
methods: {
loadData() {
if (tt.getSystemInfoSync().platform === 'ios') {
this.os = 'ios';
}
loadData() {
if (tt.getSystemInfoSync().platform === 'ios') {
this.os = 'ios';
}
this.post({
url: '/vip/getVipProducts',
url: '/vip/getVipProducts/cyc',
showLoading: false,
success: ({
data
}) => {
this.vipList = data.list
if (data.list != null) {
// this.selectedIndex = data.list[0].activityType;
for (let i = 0; i < data.list.length; i++) {
if (data.list[i].activityType == 1) {
this.selectedIndex = i;
break;
}
}
this.hintText = this.vipList[0].trailRemark;
if (data.list != null) {
// this.selectedIndex = data.list[0].activityType;
for (let i = 0; i < data.list.length; i++) {
if (data.list[i].activityType == 1) {
this.selectedIndex = i;
break;
}
}
}
}
});
},
clickAgreeBtn() {
this.needClick = !this.needClick
clickAgreeBtn() {
this.needClick = !this.needClick
},
dialogClose() {
this.$refs.alertDialog.close();
},
choosePack(item, index) {
this.selectedIndex = index;
this.selectedIndex = index;
this.hintText = this.vipList[this.selectedIndex].trailRemark;
},
clickAgree() {
// let url = 'https://mints-web.mints-id.com/agreements/scandemon/gmxy.html';
// navigateTo(`/pages/brower/brower?url=` + url);
// navigateTo(`/pages/brower/brower?url=` + url);
this.$refs.alertDialog.open();
},
handlePay() {
......@@ -147,127 +155,127 @@
let that = this;
let vipBean = this.vipList[this.selectedIndex];
this.post({
url: '/vip/getVipPayParams/douyin',
data: {
vedioId: that.point <= 0 ? null : that.vedioId,
os: that.os,
pid: vipBean.pid
},
showLoading: true,
success: ({
data
}) => {
if (vipBean.trial == 1) {
// 签约
that.ttCreateSignOrder(data, vipBean.largeType);
} else {
that.ttPrePay(data, vipBean.largeType);
}
}
this.post({
url: '/vip/getVipPayParams/douyin',
data: {
vedioId: that.point <= 0 ? null : that.vedioId,
os: that.os,
pid: vipBean.pid
},
showLoading: true,
success: ({
data
}) => {
if (vipBean.trial == 1) {
// 签约
that.ttCreateSignOrder(data, vipBean.largeType);
} else {
that.ttPrePay(data, vipBean.largeType);
}
}
});
},
ttCreateSignOrder(ttData, largeType) {
if (!tt.canIUse('createSignOrder')) {
message.notify('请升级抖音APP版本.');
return
}
if (!tt.canIUse('sign')) {
message.notify('请升级抖音APP版本.');
return
}
let that = this;
tt.createSignOrder({
businessType: 2,
data: ttData.params.data,
byteAuthorization: ttData.params.byteAuthorization,
success: (res) => {
tt.sign({
businessType: 2,
orderId: res.authOrderId,
success: (res) => {
that.queryOrderStatus(largeType, ttData.tidStr);
}
})
},
fail: (res) => {
console.log('createSignOrdercreateSignOrder->:', JSON.stringify(res));
}
})
},
ttPrePay(ttData, largeType) {
if (!tt.canIUse('requestOrder')) {
message.notify('请升级抖音APP版本!');
return
}
let that = this;
tt.requestOrder({
data: ttData.params.data,
byteAuthorization: ttData.params.byteAuthorization,
success(res) {
that.ttPay(largeType, res.orderId, ttData);
},
fail(res) {
// message.notify(res.errMsg);
console.log('requestOrder res.errMsg',res)
},
});
},
ttPay(largeType, oid, ttData) {
if (!tt.canIUse('getOrderPayment')) {
message.notify('请升级抖音APP版本~');
return
}
let that = this;
if (this.os == 'ios') {
if (!tt.canIUse('getOrderPayment.object.imId')) {
message.notify('请升级抖音APP版本.');
return
}
tt.getOrderPayment({
orderId: oid,
imId: ttData.imId,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {
console.log('ios=ttPay res.errMsg',res)
// message.notify(res.errMsg);
},
});
} else {
tt.getOrderPayment({
orderId: oid,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {
console.log('android=ttPay res.errMsg',res)
// message.notify(res.errMsg);
},
});
}
},
queryOrderStatus(largeType, tid) {
let that = this;
this.post({
data: {
tid: tid
},
url: '/vip/queryVipOrder',
showLoading: true,
success: ({
data
}) => {
that.paySuccess(largeType);
}
});
ttCreateSignOrder(ttData, largeType) {
if (!tt.canIUse('createSignOrder')) {
message.notify('请升级抖音APP版本.');
return
}
if (!tt.canIUse('sign')) {
message.notify('请升级抖音APP版本.');
return
}
let that = this;
tt.createSignOrder({
businessType: 2,
data: ttData.params.data,
byteAuthorization: ttData.params.byteAuthorization,
success: (res) => {
tt.sign({
businessType: 2,
orderId: res.authOrderId,
success: (res) => {
that.queryOrderStatus(largeType, ttData.tidStr);
}
})
},
fail: (res) => {
console.log('createSignOrdercreateSignOrder->:', JSON.stringify(res));
}
})
},
ttPrePay(ttData, largeType) {
if (!tt.canIUse('requestOrder')) {
message.notify('请升级抖音APP版本!');
return
}
let that = this;
tt.requestOrder({
data: ttData.params.data,
byteAuthorization: ttData.params.byteAuthorization,
success(res) {
that.ttPay(largeType, res.orderId, ttData);
},
fail(res) {
// message.notify(res.errMsg);
console.log('requestOrder res.errMsg', res)
},
});
},
ttPay(largeType, oid, ttData) {
if (!tt.canIUse('getOrderPayment')) {
message.notify('请升级抖音APP版本~');
return
}
let that = this;
if (this.os == 'ios') {
if (!tt.canIUse('getOrderPayment.object.imId')) {
message.notify('请升级抖音APP版本.');
return
}
tt.getOrderPayment({
orderId: oid,
imId: ttData.imId,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {
console.log('ios=ttPay res.errMsg', res)
// message.notify(res.errMsg);
},
});
} else {
tt.getOrderPayment({
orderId: oid,
success(res) {
that.queryOrderStatus(largeType, ttData.tidStr);
},
fail(res) {
console.log('android=ttPay res.errMsg', res)
// message.notify(res.errMsg);
},
});
}
},
queryOrderStatus(largeType, tid) {
let that = this;
this.post({
data: {
tid: tid
},
url: '/vip/queryVipOrder',
showLoading: true,
success: ({
data
}) => {
that.paySuccess(largeType);
}
});
}
}
}
......@@ -277,97 +285,97 @@
.body {
background-color: white;
display: flex;
flex-direction: column;
.section {
display: flex;
flex-direction: column;
background: white;
}
.pack-box {
margin-top: 25rpx;
margin-left: 18rpx;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
.active {
border: 6rpx solid #fd5350 !important;
}
.pack-item {
margin-bottom: 25rpx;
margin-right: 22rpx;
width: calc(28%);
height: 230rpx;
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: 29rpx;
color: #333;
}
.price {
font-size: 40rpx;
color: #fd5350;
font-weight: 700;
}
.origin {
color: #5A3C0F;
// background: #5a1505;
background-image: linear-gradient(90deg, #F3DEBE, #EAC180);
font-size: 22rpx;
border-radius: 20rpx;
height: 30rpx;
line-height: 30rpx;
padding-top: 4rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
}
.cut-down {
position: absolute;
top: 0;
color: #fff;
background: #ff502f;
font-size: 22rpx;
border-radius: 15rpx;
height: 30rpx;
line-height: 30rpx;
padding-top: 6rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
transform: translate(0, -50%);
}
}
flex-direction: column;
.section {
display: flex;
flex-direction: column;
background: white;
}
.apply-button {
width: 90%;
border-radius: 10rpx;
background: #FFCB68;
color: #6A3D1E;
margin: 30rpx auto;
.pack-box {
margin-top: 25rpx;
margin-left: 18rpx;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
.active {
border: 6rpx solid #fd5350 !important;
}
.pack-item {
margin-bottom: 25rpx;
margin-right: 22rpx;
width: calc(28%);
height: 230rpx;
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: 29rpx;
color: #333;
}
.price {
font-size: 40rpx;
color: #fd5350;
font-weight: 700;
}
.origin {
color: #5A3C0F;
// background: #5a1505;
background-image: linear-gradient(90deg, #F3DEBE, #EAC180);
font-size: 22rpx;
border-radius: 20rpx;
height: 30rpx;
line-height: 30rpx;
padding-top: 4rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
}
.cut-down {
position: absolute;
top: 0;
color: #fff;
background: #ff502f;
font-size: 22rpx;
border-radius: 15rpx;
height: 30rpx;
line-height: 30rpx;
padding-top: 6rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
transform: translate(0, -50%);
}
}
}
.apply-button {
width: 90%;
border-radius: 10rpx;
background: #FFCB68;
color: #6A3D1E;
margin: 30rpx auto;
}
.item-agree {
......@@ -378,5 +386,12 @@
margin: 0 auto;
margin-top: 16rpx;
}
.trialStyle {
height: 50rpx;
padding: 30rpx;
font-size: 22rpx;
color: darkgray;
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment