Skip to content

U
uniapp_vedio
Commit 467d104c authored by mengcuiguang's avatar mengcuiguang
Browse files
Options

添加看点产品逻辑

parent 69d27797
Show whitespace changes
Inline Side-by-side
Showing with 216 additions and 172 deletions
vedio/components/coin-popup/coin-popup.vue
View file @ 467d104c
<template> <template>
<view> <view>
<uni-popup type="bottom" ref="select" :maskClick="false" :isMaskClick="false"> <uni-popup type="bottom" ref="coinPop" :maskClick="false" :isMaskClick="false">
<view class="body" style="width: 100%;height: 100%;"> <view class="body">
<scroll-view scroll-y> <scroll-view scroll-y style="width: 100%;height: 100%;">
<view style="display: flex;flex-direction: column;align-items: flex-end;"> <view style="display: flex;flex-direction: column;align-items: flex-end;">
<image @click="handleClose" <image @click="handleClose"
style="width: 30rpx;height: 30rpx;display: flex;align-items: right;margin: 15rpx;" style="width: 30rpx;height: 30rpx;display: flex;align-items: right;margin-top: 20rpx;margin-right: 20rpx;margin-bottom: 10rpx;"
src="@/static/index/ic_quit_white.png"></image> src="@/static/index/ic_quit_white.png"></image>
</view> </view>
<view style="display: flex;flex-direction: column;align-items: center;margin-bottom: 20rpx;"> <view style="display: flex;flex-direction: column;align-items: center;margin-bottom: 20rpx;">
<view style="font-size: 30rpx;color: black;">超多精彩好剧一键解锁</view> <view style="font-size: 38rpx;color: black;">超多精彩好剧一键解锁</view>
<view style="display: flex;flex-direction: row;margin-top: 10rpx;"> <view style="display: flex;flex-direction: row;margin-top: 10rpx;">
<view style="font-size: 24rpx;color: #644238;margin-top: 16rpx;">账户余额: </view> <view style="font-size: 28rpx;color: #644238;margin-top: 12rpx;">账户余额：</view>
<view style="font-size: 40rpx;color: red;font-weight: 777;">123</view> <view style="font-size: 42rpx;color: red;font-weight: 777;">{{userBean.point}}</view>
<view style="font-size: 24rpx;color: #644238;margin-top: 16rpx;"> K币</view> <view style="font-size: 28rpx;color: #644238;margin-top: 12rpx;margin-left: 6rpx;">看点</view>
</view> </view>
</view> </view>
<view class="section"> <view class="section">
...@@ -22,22 +22,26 @@ ...@@ -22,22 +22,26 @@
v-for='(item, index) in vipList' :key='index' @click="choosePack(item, index)"> v-for='(item, index) in vipList' :key='index' @click="choosePack(item, index)">
<view style="display: flex;flex-direction: column;align-items: center;"> <view style="display: flex;flex-direction: column;align-items: center;">
<view class="price row">
{{item.firstPayPrice}}元
</view>
<view class="name row"> <view class="name row">
{{item.title}} {{item.title}}
</view> </view>
<view class="price row">
￥{{item.firstPayPrice}}
</view>
<view class="origin row" v-if='item.oldPrice'> <view class="origin row" v-if='item.oldPrice'>
原价：{{item.oldPrice}} {{item.remarks}}
</view> </view>
</view> </view>
<view class="cut-down" v-if='item.oldPrice-item.firstPayPrice>0'> <view class="cut-down" v-if='item.topTitle.length>0'>
立省 {{item.oldPrice-item.firstPayPrice}} 元 {{item.topTitle}}
</view> </view>
<view v-if="index==selectedIndex" style="position: absolute;bottom: 0;right: 0;"> <view v-if="index==selectedIndex" style="position: absolute;bottom: 0;right: 0;">
<image style="width: 24rpx;height: 24rpx;display: flex;align-items: right;" <image mode="scaleToFill"
src="@/static/index/ic_quit_white.png"></image> 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>
...@@ -45,7 +49,7 @@ ...@@ -45,7 +49,7 @@
</view> </view>
<view style="display: flex;flex-direction: column;align-items: center;"> <view style="display: flex;flex-direction: column;align-items: center;">
<view style="font-size: 24rpx;color: gray;margin-top: 16rpx;margin-bottom: 8rpx;"> <view style="font-size: 24rpx;color: gray;margin-top: 16rpx;margin-bottom: 18rpx;">
订单中如有疑问，请在个人中心联系客服</view> 订单中如有疑问，请在个人中心联系客服</view>
</view> </view>
</scroll-view> </scroll-view>
...@@ -69,6 +73,7 @@ ...@@ -69,6 +73,7 @@
return { return {
vipList: [], vipList: [],
selectedIndex: 0, selectedIndex: 0,
userBean: {},
showClone: false showClone: false
}; };
}, },
...@@ -79,10 +84,10 @@ ...@@ -79,10 +84,10 @@
this.handleClose(); this.handleClose();
}, },
handleShow() { handleShow() {
this.$refs.select.open('bottom'); this.$refs.coinPop.open('bottom');
this.post({ this.post({
url: '/vip/getVipProducts', url: '/vip/getVipProducts/point',
showLoading: false, showLoading: false,
success: ({ success: ({
data data
...@@ -93,9 +98,19 @@ ...@@ -93,9 +98,19 @@
} }
} }
}); });
this.post({
url: '/user/baseMsg',
showLoading: false,
success: ({
data
}) => {
this.userBean = data;
}
});
}, },
handleClose() { handleClose() {
this.$refs.select.close('bottom'); this.$refs.coinPop.close('bottom');
this.$emit('close'); this.$emit('close');
}, },
choosePack(item, index) { choosePack(item, index) {
...@@ -162,24 +177,18 @@ ...@@ -162,24 +177,18 @@
background-color: white; background-color: white;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative; align-items: center;
}
.section { .section {
padding: 0 20rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background: #fff; background: white;
.title {
font-size: 32rpx;
font-weight: 700;
color: #333;
margin-bottom: 30rpx;
} }
.pack-box { .pack-box {
margin-top: 25rpx; margin-top: 25rpx;
margin-left: 20rpx; margin-left: 18rpx;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
...@@ -192,7 +201,7 @@ ...@@ -192,7 +201,7 @@
.pack-item { .pack-item {
margin-bottom: 25rpx; margin-bottom: 25rpx;
margin-right: 22rpx; margin-right: 22rpx;
width: calc(44%); width: calc(45%);
height: 200rpx; height: 200rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -212,19 +221,19 @@ ...@@ -212,19 +221,19 @@
} }
.name { .name {
font-size: 26rpx; font-size: 32rpx;
font-weight: 700; font-weight: 700;
color: #333; color: #333;
} }
.price { .price {
font-size: 30rpx; font-size: 40rpx;
color: #fd5350; color: #fd5350;
font-weight: 700; font-weight: 700;
} }
.origin { .origin {
font-size: 22rpx; font-size: 30rpx;
color: #333; color: #333;
} }
...@@ -237,18 +246,12 @@ ...@@ -237,18 +246,12 @@
border-radius: 15rpx; border-radius: 15rpx;
height: 30rpx; height: 30rpx;
line-height: 30rpx; line-height: 30rpx;
padding: 0 10rpx; padding-top: 6rpx;
padding-bottom: 3rpx;
padding-left: 16rpx;
padding-right: 16rpx;
transform: translate(0, -50%); transform: translate(0, -50%);
} }
} }
} }
.apply-button {
border-radius: 50rpx;
background: #e8c8ae;
color: #8d5a29;
margin: 30rpx auto;
}
}
}
</style> </style>
\ No newline at end of file
vedio/pages/my/my.vue
View file @ 467d104c
<template> <template>
<view class="body"> <view class="body" >
<scroll-view scroll-y="true" :style="'height: '+(windowHeight -60)+'px;'">
<view <view
:style="'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+statusBarHeight+'px;'"> :style="'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+statusBarHeight+'px;'">
<image class="avatar" src="@/static/logo-about.png"></image> <image class="avatar" src="@/static/logo-about.png"></image>
...@@ -8,7 +9,7 @@ ...@@ -8,7 +9,7 @@
</view> </view>
</view> </view>
<view <view v-if="userBean.showVipInner"
style="display: flex;flex-direction: row;background: #f5ca86;margin: 20rpx;padding: 40rpx;border-radius:20rpx;align-items: center;justify-content:space-between;"> style="display: flex;flex-direction: row;background: #f5ca86;margin: 20rpx;padding: 40rpx;border-radius:20rpx;align-items: center;justify-content:space-between;">
<view style="display: flex;flex-direction: column;justify-content: center;"> <view style="display: flex;flex-direction: column;justify-content: center;">
<view style="font-size: 36rpx;color: #5b1500;font-weight: 777;"> <view style="font-size: 36rpx;color: #5b1500;font-weight: 777;">
...@@ -34,7 +35,36 @@ ...@@ -34,7 +35,36 @@
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/bg_my_vip.png" mode="scaleToFill"></image> src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/bg_my_vip.png" mode="scaleToFill"></image>
</view> </view>
<view v-if="userBean.expireTime<=0" style="display: flex;height: 200rpx;margin: 20rpx;background: #f5ca86;border-radius: 20rpx;">
<view style="flex-grow: 2; margin-left: 20rpx;">
<view
style="width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;">
<view style="display: flex;align-items: center;">
<image
style="width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src="https://mints-pkg.oss-cn-beijing.aliyuncs.com/pkg/img/ic_my_coin.png"></image>
<view style="font-size: 36rpx;font-weight: 777;">看点充值</view>
</view>
<view style="font-size: 28rpx;color: #5b1500;margin-top: 20rpx;">海量看点狂洒中,好剧等你来解锁</view>
</view>
</view>
<view style="width: 220rpx;">
<view
style="width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;">
<view style="font-size: 30rpx;color: #5b1500;margin-bottom: 20rpx;">{{userBean.point}}</view>
<view @click="handleCoinPay"
style="width: 160rpx;height: 60rpx;background-color: #5b1500;border-radius:30rpx;color: white;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;">
去充值
</view>
</view>
</view>
</view>
<view class="infobg" style="margin: 20rpx;"> <view class="infobg" style="margin: 20rpx;">
<view v-if="userBean.showVipInner" class="item arrow" @click="handlePayRecord">
我的订单
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view class="item arrow" @click="handleDotRecord"> <view class="item arrow" @click="handleDotRecord">
看点记录 看点记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view> <view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
...@@ -47,10 +77,6 @@ ...@@ -47,10 +77,6 @@
观看记录 观看记录
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view> <view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view> </view>
<view class="item arrow" @click="handlePayRecord">
我的订单
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view>
<view class="item arrow" @click="handlePhone"> <view class="item arrow" @click="handlePhone">
联系客服 联系客服
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view> <view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
...@@ -60,9 +86,10 @@ ...@@ -60,9 +86,10 @@
<view style="display: flex;justify-content: center;margin-top: 20rpx;font-size: 26rpx;color: gray;"> <view style="display: flex;justify-content: center;margin-top: 20rpx;font-size: 26rpx;color: gray;">
{{ versionName }} {{ versionName }}
</view> </view>
</scroll-view>
<coin-popup :show="showAnimate" @close="showAnimate = false" @paySuccess="paySuccess"> <coin-popup :show="showAnimate" @close="showAnimate = false" @paySuccess="paySuccess">
</coin-popup> </coin-popup>
</view> </view>
</template> </template>
...@@ -93,11 +120,13 @@ ...@@ -93,11 +120,13 @@
statusBarHeight: app.globalData.statusBarHeight, statusBarHeight: app.globalData.statusBarHeight,
userBean: {}, userBean: {},
showAnimate: false, showAnimate: false,
windowHeight: 0,
versionName: app.globalData.versionName versionName: app.globalData.versionName
}; };
}, },
methods: { methods: {
show() { show() {
this.windowHeight = uni.getSystemInfoSync().windowHeight
// loadData() { // loadData() {
this.post({ this.post({
url: '/user/baseMsg', url: '/user/baseMsg',
...@@ -121,7 +150,9 @@ ...@@ -121,7 +150,9 @@
navigateTo(`/pagesD/useDotRecord/useDotRecord`) navigateTo(`/pagesD/useDotRecord/useDotRecord`)
}, },
handleWatchRecord() { handleWatchRecord() {
// navigateTo(`/pagesD/watchRecord/watchRecord`) navigateTo(`/pagesD/watchRecord/watchRecord`)
},
handleCoinPay() {
this.showAnimate = true; this.showAnimate = true;
}, },
handlePayRecord() { handlePayRecord() {
...@@ -132,30 +163,40 @@ ...@@ -132,30 +163,40 @@
}, },
handlePhone() { handlePhone() {
// 联系我们 // 联系我们
this.post({ // this.post({
url: '/vedio/customerServiceNumbers', // url: '/vedio/customerServiceNumbers',
showLoading: false, // showLoading: false,
success: ({ // success: ({
data // data
}) => { // }) => {
let datas = data.customerServiceNumbers.split(',') // let datas = data.customerServiceNumbers.split(',')
let corpid = datas[0] // let corpid = datas[0]
let curl = datas[1] // let curl = datas[1]
wx.openCustomerServiceChat({ // wx.openCustomerServiceChat({
extInfo: { // extInfo: {
url: curl // url: curl
// },
// corpId: corpid,
// success(res) {},
// fail(e) {
// console.log(e)
// }
// })
// }
// });
wx.makePhoneCall({
phoneNumber: '4000969950',
success: function(res) {
console.log('拨打电话成功！');
}, },
corpId: corpid, fail: function(res) {
success(res) {}, console.log('拨打电话失败！');
fail(e) {
console.log(e)
} }
}) })
}
});
}, },
paySuccess(){ paySuccess() {
} }
} }
......
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