|
@@ -12,7 +12,7 @@
|
|
</view>
|
|
</view>
|
|
</div>
|
|
</div>
|
|
<view>
|
|
<view>
|
|
- <text class="text-bold mine_min">30</text>
|
|
|
|
|
|
+ <text class="text-bold mine_min">{{ userinfo.play_time }}</text>
|
|
</view>
|
|
</view>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@@ -23,166 +23,120 @@
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- 黄金会员-->
|
|
<!-- 黄金会员-->
|
|
- <div class="gold vip">
|
|
|
|
- <van-row>
|
|
|
|
- <van-col span="8" offset="6">
|
|
|
|
- <div class="card_body">
|
|
|
|
- <view>
|
|
|
|
- <text class="mine_min text-white">200</text>
|
|
|
|
- <text class="text-white">分钟</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">3个月专注力训练课程</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">分级利润权益</text>
|
|
|
|
- </view>
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- <van-col span="5" offset="4">
|
|
|
|
- <div class="card_body">
|
|
|
|
-
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">价格</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white mine_min">199</text>
|
|
|
|
- </view>
|
|
|
|
- <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
|
|
|
|
-
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- </van-row>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div v-for="(item,index) in time_cards" :key="index">
|
|
|
|
+ <div class="vip" :class="item.bg">
|
|
|
|
+ <van-row>
|
|
|
|
+ <van-col span="8" offset="6">
|
|
|
|
+ <div class="card_body">
|
|
|
|
+ <view>
|
|
|
|
+ <text class="mine_min text-white">{{ item.play_time }}</text>
|
|
|
|
+ <text class="text-white">分钟</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white text-sm">{{ item.title1 }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white text-sm">{{ item.title2 }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ </div>
|
|
|
|
+ </van-col>
|
|
|
|
+
|
|
|
|
+ <van-col span="5" offset="4">
|
|
|
|
+ <div class="card_body">
|
|
|
|
+
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white text-sm">价格</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white mine_min">{{ item.price }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt=""
|
|
|
|
+ @click="card_action_show = item.goods_id">
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </van-col>
|
|
|
|
+
|
|
|
|
+ </van-row>
|
|
|
|
+ </div>
|
|
|
|
|
|
- <!-- 描述-->
|
|
|
|
- <view class="desc">
|
|
|
|
|
|
+ <view v-if="card_action_show == item.goods_id">
|
|
|
|
|
|
- 黄金会员权益:<br>
|
|
|
|
- 1)获得核销时间为200分钟,有效期3个自然月(从购买当日时间开始计时)。<br>
|
|
|
|
- 2)获得5张次卡(实体卡),次卡不能自己使用,只能用给其它人使用。获得次卡的用户A可进行1次到店体验,且成为黄金会员的一级分销用户。<br>
|
|
|
|
- 如果次卡用户A进行消费,则黄金会员用户则获得以下对应的分润:<br>
|
|
|
|
- 购买次卡获得20元分润,购买黄金会员卡获得50元分润,购买白金会员获得100元分润,购买钻石会员则获得200元分润,线下购买创客代理获得300元分润,线下购买区域代理获得600元分润,线下购买合伙人,获得2000元分润。<br>
|
|
|
|
- 如果次卡用户A发展其它人B成为水母会员用户,则B作为次卡用户A的一级分销用户,也是黄金会员的二级分销用户,如果B产生消费,则次卡会员A获得一级分润(同上述的黄金会员一级分润)黄金会员可获得如下二级分润:<br>
|
|
|
|
- B购买次卡获得5元分润,购买黄金会员卡获得15元分润,购买白金会员获得30元分润,购买钻石会员则获得60元分润。线下购买创客代理获得90元分润,线下购买区域代理获得180元分润,线下购买合伙人,获得600元分润。<br>
|
|
|
|
|
|
|
|
- </view>
|
|
|
|
|
|
+ <!-- 描述-->
|
|
|
|
+ <view class="desc" v-html="item.content">
|
|
|
|
|
|
|
|
+ </view>
|
|
|
|
|
|
- <!-- 购买按钮-->
|
|
|
|
- <div class="buy_button">
|
|
|
|
- <button class="cu-btn lg bg-orange text-center margin " @click="open_order_confirm">购买黄金会员</button>
|
|
|
|
- </div>
|
|
|
|
|
|
|
|
- <!-- 白金会员-->
|
|
|
|
- <div class="platina vip">
|
|
|
|
- <van-row>
|
|
|
|
- <van-col span="8" offset="6">
|
|
|
|
- <div class="card_body">
|
|
|
|
- <view>
|
|
|
|
- <text class="mine_min text-white">600</text>
|
|
|
|
- <text class="text-white">分钟</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">租赁设备</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">更高分级利润权益</text>
|
|
|
|
- </view>
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- <van-col span="5" offset="4">
|
|
|
|
- <div class="card_body">
|
|
|
|
-
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">价格</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white mine_min">599</text>
|
|
|
|
- </view>
|
|
|
|
- <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
|
|
|
|
-
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- </van-row>
|
|
|
|
|
|
+ <!-- 购买按钮-->
|
|
|
|
+ <div class="buy_button">
|
|
|
|
+ <button class="cu-btn lg bg-orange text-center margin " @click="open_order_confirm(item)">购买{{
|
|
|
|
+ item.goods_name
|
|
|
|
+ }}
|
|
|
|
+ </button>
|
|
|
|
+ </div>
|
|
|
|
+ </view>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
- <!-- 钻石会员-->
|
|
|
|
- <div class="diamond vip">
|
|
|
|
- <van-row>
|
|
|
|
- <van-col span="8" offset="6">
|
|
|
|
- <div class="card_body">
|
|
|
|
- <view>
|
|
|
|
- <text class="mine_min text-white">1000</text>
|
|
|
|
- <text class="text-white text-sm">分钟</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">租赁设备</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">更高分级利润权益</text>
|
|
|
|
- </view>
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- <van-col span="5" offset="4">
|
|
|
|
- <div class="card_body">
|
|
|
|
-
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">价格</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white mine_min">199</text>
|
|
|
|
- </view>
|
|
|
|
- <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
|
|
|
|
-
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- </van-row>
|
|
|
|
- </div>
|
|
|
|
|
|
|
|
<div class="title flex padding align-center">
|
|
<div class="title flex padding align-center">
|
|
<div class="line margin-right"></div>
|
|
<div class="line margin-right"></div>
|
|
- <text>体验磁卡次卡</text>
|
|
|
|
|
|
+ <text>体验次卡</text>
|
|
</div>
|
|
</div>
|
|
<!-- 体验次卡-->
|
|
<!-- 体验次卡-->
|
|
- <div class="normal vip">
|
|
|
|
- <van-row>
|
|
|
|
- <van-col span="8" offset="6">
|
|
|
|
- <div class="card_body">
|
|
|
|
- <view>
|
|
|
|
- <text class="mine_min text-white">200</text>
|
|
|
|
- <text class="text-white">分钟</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">3个月专注力训练课程</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">分级利润权益</text>
|
|
|
|
- </view>
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- <van-col span="5" offset="4">
|
|
|
|
- <div class="card_body">
|
|
|
|
-
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white text-sm">价格</text>
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- <text class="text-white mine_min">199</text>
|
|
|
|
- </view>
|
|
|
|
- <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt="">
|
|
|
|
-
|
|
|
|
- </div>
|
|
|
|
- </van-col>
|
|
|
|
-
|
|
|
|
- </van-row>
|
|
|
|
|
|
+ <div v-for="(item,index) in frequency_card" :key="index">
|
|
|
|
+
|
|
|
|
+ <div class="normal vip">
|
|
|
|
+ <van-row>
|
|
|
|
+ <van-col span="8" offset="6">
|
|
|
|
+ <div class="card_body">
|
|
|
|
+ <view>
|
|
|
|
+ <text class="mine_min text-white">{{ item.play_time }}</text>
|
|
|
|
+ <text class="text-white">分钟</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white text-sm">{{ item.title1 }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white text-sm">{{ item.title2 }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ </div>
|
|
|
|
+ </van-col>
|
|
|
|
+
|
|
|
|
+ <van-col span="5" offset="4">
|
|
|
|
+ <div class="card_body">
|
|
|
|
+
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white text-sm">价格</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="text-white mine_min">{{ item.price }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <img src="https://img.shuimuai.com/web/btn_seedetil_2.png" class="check_detail" alt=""
|
|
|
|
+ @click="card_action_show = item.goods_id">
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </van-col>
|
|
|
|
+
|
|
|
|
+ </van-row>
|
|
|
|
+ </div>
|
|
|
|
+ <view v-if="card_action_show == item.goods_id">
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <!-- 描述-->
|
|
|
|
+ <view class="desc" v-html="item.content">
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <!-- 购买按钮-->
|
|
|
|
+ <div class="buy_button">
|
|
|
|
+ <button class="cu-btn lg bg-orange text-center margin " @click="open_order_confirm(item)">购买{{
|
|
|
|
+ item.goods_name
|
|
|
|
+ }}
|
|
|
|
+ </button>
|
|
|
|
+ </div>
|
|
|
|
+ </view>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
@@ -190,11 +144,11 @@
|
|
<van-popup :show="order_confirm" @close="close_order_confirm" round closeable>
|
|
<van-popup :show="order_confirm" @close="close_order_confirm" round closeable>
|
|
<div class="order_confirm padding">
|
|
<div class="order_confirm padding">
|
|
<view>
|
|
<view>
|
|
- <text class="text-sm text-gray">已选商品 水母星球-钻石会员</text>
|
|
|
|
|
|
+ <text class="text-sm text-gray">已选商品 水母星球-{{ selection_card.goods_name }}</text>
|
|
<br>
|
|
<br>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<view>
|
|
- <text class="text-sm text-gray">商品价格 299元</text>
|
|
|
|
|
|
+ <text class="text-sm text-gray">商品价格 {{ selection_card.price }}元</text>
|
|
<br>
|
|
<br>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
@@ -205,7 +159,7 @@
|
|
</view>
|
|
</view>
|
|
<view class="order_price_container">
|
|
<view class="order_price_container">
|
|
<text class="text-sm text-gray">实付(元) </text>
|
|
<text class="text-sm text-gray">实付(元) </text>
|
|
- <text class="mine_min">299</text>
|
|
|
|
|
|
+ <text class="mine_min">{{ selection_card.price }}</text>
|
|
</view>
|
|
</view>
|
|
<button class="cu-btn bg-primary lg text-white recharge_button" @click="success_pay">立即充值</button>
|
|
<button class="cu-btn bg-primary lg text-white recharge_button" @click="success_pay">立即充值</button>
|
|
</div>
|
|
</div>
|
|
@@ -238,12 +192,13 @@
|
|
</view>
|
|
</view>
|
|
<view class="sub-title">
|
|
<view class="sub-title">
|
|
<text class="text-gray">
|
|
<text class="text-gray">
|
|
- 黄金会员包含 5张 实体邀请卡,我们将以快递形式发出,请填写收货地址.
|
|
|
|
|
|
+ {{ selection_card.goods_name }}卡,我们将以快递形式发出,请填写收货地址.
|
|
</text>
|
|
</text>
|
|
</view>
|
|
</view>
|
|
<div class="button_group flex justify-around">
|
|
<div class="button_group flex justify-around">
|
|
- <button class="cu-btn bg-gray text-white lg" @click="close_success_pop">以后再填</button>
|
|
|
|
- <button class="cu-btn bg-primary text-white lg" @click="to_write_address">填写地址</button>
|
|
|
|
|
|
+ <!-- <button class="cu-btn bg-gray text-white lg" @click="close_success_pop">以后再填</button>-->
|
|
|
|
+ <!-- <button class="cu-btn bg-primary text-white lg" @click="to_write_address">填写地址</button>-->
|
|
|
|
+ <button class="cu-btn bg-primary text-white lg" @click="to_index">充值成功</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</van-popup>
|
|
</van-popup>
|
|
@@ -252,6 +207,9 @@
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
|
|
|
|
+import {goodsCardList} from "../../../requests/goods";
|
|
|
|
+import {createOrder} from "../../../requests/orders";
|
|
|
|
+
|
|
var $this
|
|
var $this
|
|
export default {
|
|
export default {
|
|
name: "uc_recharge_container",
|
|
name: "uc_recharge_container",
|
|
@@ -260,14 +218,25 @@ export default {
|
|
return {
|
|
return {
|
|
order: {},
|
|
order: {},
|
|
order_confirm: false,
|
|
order_confirm: false,
|
|
|
|
+ card_action_show: 1,
|
|
err_show: false,
|
|
err_show: false,
|
|
- success_show: true
|
|
|
|
|
|
+ success_show: false,
|
|
|
|
+ //时间卡列表
|
|
|
|
+ time_cards: [],
|
|
|
|
+ //次卡列表
|
|
|
|
+ frequency_card: [],
|
|
|
|
+ //用户信息
|
|
|
|
+ userinfo: {},
|
|
|
|
+ // 选中的充值卡
|
|
|
|
+ selection_card: {}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
+ watch: {},
|
|
methods: {
|
|
methods: {
|
|
//弹出确认订单
|
|
//弹出确认订单
|
|
- open_order_confirm() {
|
|
|
|
|
|
+ open_order_confirm($item) {
|
|
$this.order_confirm = true
|
|
$this.order_confirm = true
|
|
|
|
+ $this.selection_card = $item
|
|
},
|
|
},
|
|
//关闭确认订单
|
|
//关闭确认订单
|
|
close_order_confirm() {
|
|
close_order_confirm() {
|
|
@@ -293,20 +262,72 @@ export default {
|
|
repay() {
|
|
repay() {
|
|
|
|
|
|
},
|
|
},
|
|
|
|
+ to_index() {
|
|
|
|
+ mpvue.navigateTo({
|
|
|
|
+ url: "/pages/index/main"
|
|
|
|
+ })
|
|
|
|
+ },
|
|
// 成功支付
|
|
// 成功支付
|
|
success_pay() {
|
|
success_pay() {
|
|
// 支付成功后得回调方法
|
|
// 支付成功后得回调方法
|
|
|
|
+ let $params = {
|
|
|
|
+ goods_id: $this.selection_card.goods_id,
|
|
|
|
+ buy_num: 1
|
|
|
|
+ }
|
|
|
|
+ createOrder($params).then((res) => {
|
|
|
|
+ let $data = res.data
|
|
|
|
+ let $payment = $data.data
|
|
|
|
+ wx.requestPayment({
|
|
|
|
+ timeStamp: $payment.timeStamp,
|
|
|
|
+ nonceStr: $payment.nonceStr,
|
|
|
|
+ package: $payment.package,
|
|
|
|
+ signType: $payment.signType,
|
|
|
|
+ paySign: $payment.sign,
|
|
|
|
+ success(res) {
|
|
|
|
+ //支付成功
|
|
|
|
+ console.log('success', res)
|
|
|
|
+ //关闭确认订单窗口
|
|
|
|
+ $this.close_order_confirm()
|
|
|
|
+ //打开成功充值窗口
|
|
|
|
+ $this.open_success_window()
|
|
|
|
+ },
|
|
|
|
+ fail(res) {
|
|
|
|
+ console.log('fail', res)
|
|
|
|
+ $this.close_order_confirm()
|
|
|
|
+ $this.err_show = true
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ })
|
|
// 接收回调方法后弹出支付成功
|
|
// 接收回调方法后弹出支付成功
|
|
},
|
|
},
|
|
//跳转填写地址
|
|
//跳转填写地址
|
|
- to_write_address(){
|
|
|
|
|
|
+ to_write_address() {
|
|
mpvue.navigateTo({
|
|
mpvue.navigateTo({
|
|
- url:"/pages/user_center/address/list/main"
|
|
|
|
|
|
+ url: "/pages/user_center/address/list/main"
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 获取充值卡列表
|
|
|
|
+ get_card_list() {
|
|
|
|
+ goodsCardList().then((res) => {
|
|
|
|
+ let $data = res.data.data
|
|
|
|
+ $this.time_cards = $data.time_card
|
|
|
|
+ let $bg = ['gold', 'platina', 'diamond']
|
|
|
|
+ $this.time_cards.forEach(($val, $index) => {
|
|
|
|
+ $this.time_cards[$index]['bg'] = $bg[$index]
|
|
|
|
+ $this.time_cards[$index]['price'] = Math.ceil($val['price'])
|
|
|
|
+ })
|
|
|
|
+ $this.frequency_card = $data.frequency_card
|
|
|
|
+ $this.frequency_card.forEach(($val, $index) => {
|
|
|
|
+ $this.frequency_card[$index]['bg'] = 'normal'
|
|
|
|
+ $this.frequency_card[$index]['price'] = Math.round($val['price'])
|
|
|
|
+ })
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
,
|
|
,
|
|
mounted() {
|
|
mounted() {
|
|
|
|
+ $this.get_card_list()
|
|
|
|
+ $this.userinfo = wx.getStorageSync('userinfo')
|
|
},
|
|
},
|
|
created() {
|
|
created() {
|
|
$this = this;
|
|
$this = this;
|