Skip to content

U
uniapp_vedio
Commit 2a635e44 authored by jyx's avatar jyx
Browse files
Options

会员可进入VIP页面

parent 29455c48
Hide whitespace changes
Inline Side-by-side
Showing with 303 additions and 303 deletions
vedio/components/home/my.vue
View file @ 2a635e44
<template> <template>
<view class="body"> <view class="body">
<!-- <z-paging style="height: 100%;"> --> <!-- <z-paging style="height: 100%;"> -->
<view v-if="showMask" class="show-mask flex-v" @click="showMask=false"> <view v-if="showMask" class="show-mask flex-v" @click="showMask=false">
<view class="mt-30" style="width: 90%;text-align: right;"> <view class="mt-30" style="width: 90%;text-align: right;">
<image style="width: 30rpx;height: 30rpx;padding:6rpx; <image style="width: 30rpx;height: 30rpx;padding:6rpx;
border-radius: 40rpx;border: 2px solid darkgray;" src="@/static/index/ic_quit_white.png" /> border-radius: 40rpx;border: 2px solid darkgray;" src="@/static/index/ic_quit_white.png" />
</view> </view>
<text class="mt-10" style="font-size: 46rpx;">如何继续使用?</text> <text class="mt-10" style="font-size: 46rpx;">如何继续使用?</text>
<text class="m-10">找到“灵思小说阁”小程序</text> <text class="m-10">找到“灵思小说阁”小程序</text>
<image class="mt-30" mode="widthFix" :src="maskImage1"></image> <image class="mt-30" mode="widthFix" :src="maskImage1"></image>
<image :src="maskImage2" mode="widthFix"></image> <image :src="maskImage2" mode="widthFix"></image>
</view> </view>
<view <view
:style="'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+10+'px;'"> :style="'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+10+'px;'">
<image class="avatar" src="@/static/logo-about.png"></image> <image class="avatar" src="@/static/logo-about.png"></image>
<view> <view>
<view style="font-size: 34rpx;color: black;margin-left: 30rpx;">用户ID：{{userBean.idcode}}</view> <view style="font-size: 34rpx;color: black;margin-left: 30rpx;">用户ID：{{userBean.idcode}}</view>
<view style="font-size: 26rpx;color: #b5b5b5;margin-left: 30rpx;margin-top: 10rpx;"> <view style="font-size: 26rpx;color: #b5b5b5;margin-left: 30rpx;margin-top: 10rpx;">
书中自有颜如玉，书中自有黄金屋，书中自有千钟黍</view> 书中自有颜如玉，书中自有黄金屋，书中自有千钟黍</view>
</view> </view>
</view> </view>
<read-time-count-row id='count' ref='timeCount' @resize='resizeTimeCount'></read-time-count-row> <read-time-count-row id='count' ref='timeCount' @resize='resizeTimeCount'></read-time-count-row>
<view style="display: flex;height: 200rpx;margin:30rpx 20rpx;background: #263358;border-radius: 20rpx;"> <view style="display: flex;height: 200rpx;margin:30rpx 20rpx;background: #263358;border-radius: 20rpx;">
<view style="flex-grow: 2; margin-left: 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="width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;">
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<image style="width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;" <image style="width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src="https://mints-web.oss-cn-beijing.aliyuncs.com/images/ic_my_vip.png"></image> src="https://mints-web.oss-cn-beijing.aliyuncs.com/images/ic_my_vip.png"></image>
<view style="font-size: 36rpx;font-weight: 777;color: white;"> <view style="font-size: 36rpx;font-weight: 777;color: white;">
{{userBean.expireTime<=0 ? '开通VIP会员' : 'VIP会员'}} {{userBean.expireTime<=0 ? '开通VIP会员' : 'VIP会员'}}
</view> </view>
</view> </view>
<view v-if="userBean.expireTime<=0" style="font-size: 28rpx;color: #b5b5b5;margin-top: 20rpx;"> <view v-if="userBean.expireTime<=0" style="font-size: 28rpx;color: #b5b5b5;margin-top: 20rpx;">
开通会员享更多福利</view> 开通会员享更多福利</view>
<view v-else style="font-size: 28rpx;color: #b5b5b5;margin-top: 20rpx;"> <view v-else style="font-size: 28rpx;color: #b5b5b5;margin-top: 20rpx;">
到期时间:{{userBean.expireTime*1000 | formatDate('yyyy-MM-dd')}}</view> 到期时间:{{userBean.expireTime*1000 | formatDate('yyyy-MM-dd')}}</view>
</view> </view>
</view> </view>
<view v-if="userBean.expireTime<=0" style="width: 220rpx;"> <view style="width: 220rpx;">
<view <view
style="width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;"> style="width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;">
<view @click="handleCoinPay" <view @click="handleCoinPay"
style="width: 160rpx;height: 60rpx;background-color: #fff;border-radius:30rpx;color: 263358;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;"> style="width: 160rpx;height: 60rpx;background-color: #fff;border-radius:30rpx;color: 263358;font-size: 26rpx;justify-content: center;align-items: center;display: flex;padding-bottom: 4rpx;">
去开通 {{userBean.expireTime<=0 ? '去开通' : '立即续费'}}
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="infobg" style="margin: 20rpx;"> <view class="infobg" style="margin: 20rpx;">
<view class="item arrow" @click="handlePayRecord"> <view class="item arrow" @click="handlePayRecord">
我的订单 我的订单
<view class="item_bd ellipsis" style="margin-left: 58rpx;"></view> <view class="item_bd ellipsis" style="margin-left: 58rpx;"></view>
</view> </view>
<view v-if="false" class="item arrow" @click="handleDotRecord"> <view v-if="false" 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>
</view> </view>
<view v-if="false" class="item arrow" @click="handleUseDotRecord"> <view v-if="false" class="item arrow" @click="handleUseDotRecord">
消费记录 消费记录
<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="handleReadRecord"> <view class="item arrow" @click="handleReadRecord">
阅读记录 阅读记录
<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="handleFind"> <view class="item arrow" @click="handleFind">
如何找到我 如何找到我
<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="handlecdk"> <view class="item arrow" @click="handlecdk">
兑换会员 兑换会员
<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="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>
</view> </view>
</view> </view>
<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>
<!-- </z-paging> --> <!-- </z-paging> -->
<coin-popup :show="showAnimate" @close="showAnimate = false" @paySuccess="paySuccess"> <coin-popup :show="showAnimate" @close="showAnimate = false" @paySuccess="paySuccess">
</coin-popup> </coin-popup>
<kefu-popup :show="showKefuPop" @close="showKefuPop = false" /> <kefu-popup :show="showKefuPop" @close="showKefuPop = false" />
</view> </view>
</template> </template>
<script> <script>
import common from '@/mixins/common'; import common from '@/mixins/common';
import kefuPopup from '@/components/kefu-popup/kefu-popup.vue'; import kefuPopup from '@/components/kefu-popup/kefu-popup.vue';
import { import {
VERSION_CODE VERSION_CODE
} from "@/utils/utils.js" } from "@/utils/utils.js"
import { import {
navigateTo, navigateTo,
message, message,
alert, alert,
loading loading
} from '@/utils/fun.js'; } from '@/utils/fun.js';
import { import {
openUrl openUrl
} from '@/utils/app+.js'; } from '@/utils/app+.js';
const app = getApp(); const app = getApp();
export default { export default {
name: 'index', name: 'index',
mixins: [common], mixins: [common],
components: { components: {
kefuPopup kefuPopup
}, },
data() { data() {
return { return {
showMask: false, showMask: false,
showKefuPop: false, showKefuPop: false,
maskImage1: 'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find1.png', maskImage1: 'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find1.png',
maskImage2: 'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find2.png', maskImage2: 'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find2.png',
statusBarHeight: app.globalData.statusBarHeight, statusBarHeight: app.globalData.statusBarHeight,
userBean: {}, userBean: {},
showAnimate: false, showAnimate: false,
versionName: '' versionName: ''
}; };
}, },
methods: { methods: {
resizeTimeCount() { resizeTimeCount() {
this.initHeight(); this.initHeight();
}, },
refreshTimeCount() { refreshTimeCount() {
let ref = this.$refs.timeCount; let ref = this.$refs.timeCount;
if (ref) { if (ref) {
ref.refresh(); ref.refresh();
} }
}, },
initHeight() { initHeight() {
const query = uni.createSelectorQuery().in(this); const query = uni.createSelectorQuery().in(this);
query.select("#count").boundingClientRect(); query.select("#count").boundingClientRect();
}, },
show() { show() {
this.versionName='v '+VERSION_CODE this.versionName = 'v ' + VERSION_CODE
// 更新阅读时间统计 // 更新阅读时间统计
this.refreshTimeCount(); this.refreshTimeCount();
this.post({ this.post({
url: '/user/baseMsg', url: '/user/baseMsg',
showLoading: false, showLoading: false,
success: ({ success: ({
data data
}) => { }) => {
this.userBean = data; this.userBean = data;
} }
}); });
}, },
hide() { hide() {
}, },
handleDotRecord() { handleDotRecord() {
// 书豆记录 // 书豆记录
navigateTo(`/pagesD/dotRecord/dotRecord`) navigateTo(`/pagesD/dotRecord/dotRecord`)
}, },
handleUseDotRecord() { handleUseDotRecord() {
// 书豆消费记录 // 书豆消费记录
navigateTo(`/pagesD/useDotRecord/useDotRecord`) navigateTo(`/pagesD/useDotRecord/useDotRecord`)
}, },
handleReadRecord() { handleReadRecord() {
navigateTo(`/pagesD/readerRecord/readerRecord`) navigateTo(`/pagesD/readerRecord/readerRecord`)
}, },
handleCoinPay() { handleCoinPay() {
this.showAnimate = true; this.showAnimate = true;
}, },
handlePayRecord() { handlePayRecord() {
navigateTo(`/pagesD/payRecord/payRecord`) navigateTo(`/pagesD/payRecord/payRecord`)
}, },
handleFind() { handleFind() {
this.showMask = true this.showMask = true
}, },
handlecdk() { handlecdk() {
navigateTo(`/pagesA/cdkey/cdkey`) navigateTo(`/pagesA/cdkey/cdkey`)
}, },
handlePhone() { handlePhone() {
this.showKefuPop = true this.showKefuPop = true
}, },
paySuccess(largeType) { paySuccess(largeType) {
// largeType=vip 开通vip // largeType=vip 开通vip
// largeType=point 购买书豆 // largeType=point 购买书豆
message.notify('支付成功'); message.notify('支付成功');
this.post({ this.post({
url: '/user/baseMsg', url: '/user/baseMsg',
showLoading: false, showLoading: false,
success: ({ success: ({
data data
}) => { }) => {
this.userBean = data; this.userBean = data;
} }
}); });
} }
} }
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
@import '@/scss/uni.scss'; @import '@/scss/uni.scss';
.body { .body {
background-color: whitesmoke; background-color: whitesmoke;
} }
.avatar { .avatar {
background-color: #d8d8d8; background-color: #d8d8d8;
width: 100rpx; width: 100rpx;
height: 100rpx; height: 100rpx;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
//box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1) //box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)
} }
.vip-item { .vip-item {
width: 100%; width: 100%;
padding: 10rpx 40rpx; padding: 10rpx 40rpx;
.content { .content {
width: 90%; width: 90%;
margin: auto; margin: auto;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
padding: 20rpx 40rpx; padding: 20rpx 40rpx;
background: #263358; background: #263358;
color: #fff; color: #fff;
border-radius: 18rpx; border-radius: 18rpx;
} }
.item { .item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
justify-content: center; justify-content: center;
margin-right: 20rpx; margin-right: 20rpx;
} }
.item:last-child { .item:last-child {
margin-right: 0; margin-right: 0;
} }
.row { .row {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
margin-bottom: 15rpx; margin-bottom: 15rpx;
} }
.row:last-child { .row:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
.title { .title {
font-size: 38rpx; font-size: 38rpx;
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
} }
.desc { .desc {
font-size: 26rpx; font-size: 26rpx;
color: #b5b5b5; color: #b5b5b5;
} }
.button { .button {
height: 40rpx; height: 40rpx;
line-height: 70rpx; line-height: 70rpx;
border-radius: 35rpx; border-radius: 35rpx;
width: 160rpx; width: 160rpx;
background: #fff; background: #fff;
color: #263358; color: #263358;
text-align: center; text-align: center;
font-size: 30rpx; font-size: 30rpx;
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
} }
} }
.show-mask { .show-mask {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
position: absolute; position: absolute;
z-index: 999; z-index: 999;
color: white; color: white;
align-items: center; align-items: center;
image { image {
width: 90%; width: 90%;
} }
} }
</style> </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