[公告、banner、自由服务包下单]

pages/index/free.vue

@@ -0,0 +1,95 @@
+<template>
+    <view class="introduce" v-if='loaded'>
+        <image class="richTxt" :src="base.cover" mode="widthFix" />
+        <view class="nowbuy" @click="nowBuy" v-if="!is_recharge"> <view class="btn">￥{{base.price}} 立即购买 </view> </view>
+        <view class="nowbuy nonebuy"  v-else> <view class="btn"> 已开通 </view> </view>
+    </view>
+</template>
+<script>
+    import {
+        recharge,zyPay
+    } from '@/apis/interfaces/index.js'
+    export default {
+        data() {
+            return {
+                loaded:false,
+                base: '',
+                is_recharge: true,
+            }
+        },
+        onLoad(e) {
+            this.getInfo()
+        },
+        methods:{
+            getInfo(){
+                recharge().then(res => {
+                    this.base = res.base
+                    this.is_recharge = res.is_recharge
+                    this.loaded = true
+                }).catch(err => {
+                    uni.showToast({
+                        title: err.message,
+                        icon: 'none',
+                        mask: true,
+                        duration: 2000
+                    })
+                })
+            },
+            nowBuy(){
+                zyPay(this.base.service_id).then(res => {
+                    uni.showToast({
+                        title: '支付成功',
+                        icon: 'none',
+                        mask: true,
+                        duration: 2000
+                    })
+                    this.is_recharge = true
+                    
+                }).catch(err => {
+                    console.log(err)
+                    uni.showToast({
+                        title: err.message,
+                        icon: 'none',
+                        mask: true,
+                        duration: 2000
+                    })
+                })
+            }
+        }
+    }
+</script>
+<style lang="scss" scoped>
+    .introduce{
+        padding-bottom: 120rpx;
+        .nowbuy{
+            position: fixed;
+            bottom: 0;
+            height: 120rpx;
+            padding-bottom: 20rpx;
+            text-align: center;
+            width: 100%;
+            color: #fff;
+            font-size: 32rpx;
+            font-weight: bold;
+            background-color: #fff;
+            .btn{
+                height: 90rpx;
+                line-height: 90rpx;
+                margin: 20rpx $margin*2 0 $margin*2;
+                border-radius: 80rpx;
+                background: linear-gradient( to right, #e5584c,#ee7b46);
+            }
+        }
+        .nonebuy{
+            color: #333;
+            font-weight: none;
+            .btn{
+                background: linear-gradient( to right, #ececec,#ececec);
+            }
+        }
+        .richTxt{
+            width: 100%;
+        }
+    }
+
+</style>