products/uni-shop/pages/recharge/recharge.vue

<template>
  <v-header async @fetch="fetch" scroll title="会员充值">
    <view class="recharge-screen flex">
      <view class="recharge-header relative">
        <view class="recharge-label">余额</view>
        <view class="recharge-price"><text>¥</text>{{user.money}}</view>
        <image src="/static/images/decorate.png" class="recharge-decorate absolute"></image>
        <view @click="triggerRecord" class="absolute recharge-record center">充值记录</view>
      </view>
      <view class="recharge-context">
        <view class="recharge-content row center wrap">
          <view class="recharge-item jCenter" v-for="(item,index) in configData"
            :key="index"
            :class="{'recharge-item-active': active === index}"
            @click="triggerActive(index)"
          >
            <view class="recharge-item-title">充{{item.recharge}}元</view>
            <view class="recharge-item-info">送{{item.give}}元</view>
          </view>
        </view>
        <view class="recharge-title">支付方式</view>
        <view class="recharge-pay">
          <view class="recharge-pay-item row aCenter"
            v-for="(item,index) in payData"
            :key="index"
            @click="triggerRadio(item)"
          >
            <image :src="item.icon" class="recharge-pay-icon"></image>
            <view class="flex-all-1">{{item.label}}</view>
            <v-radio :value="type === item.type" disabled borderColor="#999999" color="transparent" activeBorderColor="#41AE3C" activeColor="#41AE3C"></v-radio>
          </view>
        </view>
      </view>

      <view class="flex-all-1"></view>

      <view class="center recharge-button-container">
        <view @click="pay" class="recharge-button center">充值</view>
      </view>

    </view>
  </v-header>
</template>

<script>
import vHeader from '@/components/v-header/main';
import mixins from './mixins/index';
import vRadio from '@/components/v-radio/main';
export default {
  name: "recharge",
  components:{
    vHeader,
    vRadio
  },
  mixins
}
</script>

<style scoped src="./style.scss" lang="scss">

</style>