初始化项目

mobile-uniapp/pages/wallet/index.vue

@@ -0,0 +1,218 @@
+<template>
+  <view class="container" v-if="!isLoading">
+    <view class="space-upper">
+      <view class="wallet-image">
+        <image src="/static/wallet.png" mode="widthFix"></image>
+      </view>
+      <view class="wallet-account">
+        <view class="wallet-account_balance">
+          <text>{{ userInfo.balance }}</text>
+        </view>
+        <view class="wallet-account_lable">
+          <text>账户余额(元)</text>
+        </view>
+      </view>
+    </view>
+    <view class="space-lower">
+      <view class="space-lower_item btn-recharge btn-group">
+        <view v-if="setting.is_entrance" class="btn-submit" @click="onTargetRecharge()">充 值</view>
+		<view v-if="share.is_entrance" class="btn-submit" @click="onTargetShare()">分 享</view>
+		<view v-if="exchange.is_entrance" class="btn-submit" @click="onTargetExchange()">实体卡兑换</view>
+      </view>
+      <view class="space-lower_item item-lable dis-flex flex-x-around">
+        <view class="lable-text" @click="onTargetBalanceLog()">
+          <text>账单详情</text>
+        </view>
+		<view class="lable-text" @click="onTargetExchangeLog()">
+		  <text>兑换记录</text>
+		</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+  import * as UserApi from '@/api/user'
+  import SettingModel from '@/common/model/Setting'
+  import SettingKeyEnum from '@/common/enum/setting/Key'
+
+  export default {
+    data() {
+      return {
+        // 正在加载
+        isLoading: true,
+        // 会员信息
+        userInfo: {},
+        // 充值设置
+        setting: {},
+		// 实体卡兑换设置
+		exchange: {},
+		// 分享设置
+		share: {},
+      }
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onShow(options) {
+      // 获取页面数据
+      this.getPageData()
+    },
+
+    methods: {
+
+      // 获取页面数据
+      getPageData() {
+        const app = this
+        app.isLoading = true
+        Promise.all([app.getUserInfo(), app.getSetting(), app.getExchange(), app.getShare()])
+          .then(() => app.isLoading = false)
+      },
+
+      // 获取会员信息
+      getUserInfo() {
+        const app = this
+        return new Promise((resolve, reject) => {
+          UserApi.info()
+            .then(result => {
+              app.userInfo = result.data.userInfo
+              resolve(app.userInfo)
+            })
+        })
+      },
+
+      // 获取充值设置
+      getSetting() {
+        const app = this
+        return new Promise((resolve, reject) => {
+          SettingModel.item(SettingKeyEnum.RECHARGE.value, false)
+            .then(data => {
+              app.setting = data
+              resolve(data)
+            })
+        })
+      },
+	  
+	  // 获取兑换设置
+	  getExchange() {
+	    const app = this
+	    return new Promise((resolve, reject) => {
+	      SettingModel.item(SettingKeyEnum.EXCHANGE.value, false)
+	        .then(data => {
+	          app.exchange = data
+	          resolve(data)
+	        })
+	    })
+	  },
+	  
+	  // 获取分享设置
+	  getShare() {
+	    const app = this
+	    return new Promise((resolve, reject) => {
+	      SettingModel.item(SettingKeyEnum.SHARE.value, false)
+	        .then(data => {
+	          app.share = data
+	          resolve(data)
+	        })
+	    })
+	  },
+	  
+	  // 跳转分享页面
+	  onTargetShare() {
+	    this.$navTo('pages/wallet/share/index')
+	  },
+	  
+	  // 跳转兑换页面
+	  onTargetExchange() {
+	    this.$navTo('pages/wallet/exchange/index')
+	  },
+	  
+
+      // 跳转充值页面
+      onTargetRecharge() {
+        this.$navTo('pages/wallet/recharge/index')
+      },
+
+      // 跳转充值记录页面
+      onTargetRechargeOrder() {
+        this.$navTo('pages/wallet/recharge/order')
+      },
+
+      // 跳转账单详情页面
+      onTargetBalanceLog() {
+        this.$navTo('pages/wallet/balance/log')
+      },
+	  
+	  // 跳转兑换详情页面
+	  onTargetExchangeLog() {
+	    this.$navTo('pages/wallet/exchange/log')
+	  }
+
+    }
+  }
+</script>
+<style>
+  page {
+    background: #fff;
+  }
+</style>
+<style lang="scss" scoped>
+  .container {
+    background: #fff;
+  }
+
+  .space-upper {
+    padding: 150rpx 0;
+    text-align: center;
+  }
+
+  .wallet-image image {
+    width: 360rpx;
+    height: 261.72rpx;
+  }
+
+  .wallet-account {
+    margin-top: 20rpx;
+  }
+
+  .wallet-account_balance {
+    font-size: 56rpx;
+  }
+
+  .wallet-account_lable {
+    margin-top: 14rpx;
+    color: #cec1c1;
+    font-size: 26rpx;
+  }
+
+  .space-lower {
+    margin-top: 30rpx;
+    padding: 0 80rpx;
+  }
+  
+  .btn-group{
+	display: flex;
+	gap: 10px;
+  }
+
+  .btn-recharge .btn-submit {
+    width: 460rpx;
+    height: 84rpx;
+    margin: 0 auto;
+    border-radius: 50rpx;
+    background: #786cff;
+    color: white;
+    font-size: 30rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .item-lable {
+    margin-top: 80rpx;
+    font-size: 28rpx;
+    color: rgb(94, 94, 94);
+    padding: 0 100rpx;
+  }
+</style>