first commit

滴滴淘/h5(1)/src/view/pages/Fund.vue

@@ -0,0 +1,85 @@
+<template lang="pug">
+  //- 资金管理
+  .fund.content
+    NavbarComponent(title="资金管理" showLeft)
+    .pd43.fund_center
+      .account.flex
+        .flex_cen.flex1
+          .money
+            .money_text 本金余额
+            p.mt25 ￥{{userInfo.capital}}
+            .mt25
+              van-button(type="default" size='small' @click='cashout(1, userInfo.capital)') 提现
+        .flex_cen.flex1
+          .money
+            .money_text 佣金余额
+            p.mt25 ￥{{userInfo.commission}}
+            .mt25
+              van-button(type="default" size='small' @click='cashout(2, userInfo.commission)') 提现
+    .line
+    //- van-cell(title="绑定卡号" is-link )
+    //- van-cell(title="资金明细" is-link )
+    van-cell(title="本金记录" is-link to='/principalRecord' )
+    van-cell(title="提现记录" is-link to='/cashwithdrawal' )
+    van-cell(title="佣金记录" is-link to='/collection' )
+    .line
+</template>
+<script lang="ts">
+  import {Component, Provide, Vue, Inject} from 'vue-property-decorator';
+  import NavbarComponent from "@/components/Navbar.vue";
+  import { Dialog } from 'vant';
+
+  @Component({
+    components: {
+      NavbarComponent
+    }
+  })
+  export default class Fund extends Vue {
+    $http: any
+    // inject 注入 App.vue 提供的变量
+    @Inject() readonly HiddenTabBar!: Function
+    @Inject() readonly ShowTabBar!: Function
+
+    private userInfo: any = {}
+
+    private created(): void {
+      this.HiddenTabBar()
+      this.getMemberInfo()
+    }
+
+    beforeRouteLeave (to: any, from: any, next: any) {
+      this.ShowTabBar()
+      next()
+    }
+
+    // 提现操作
+    private cashout(type: number ,money: number): void {
+      if(money <= 0){
+        this.$toast('余额不足')
+        return
+      }
+      let message = type == 1?`本次本金提现金额为 ${money} 元`: `本次本金提现金额为 ${money} 元`
+      Dialog.confirm({
+        title: '你正在进行提现操作',
+        message: message,
+        confirmButtonText: '提现'
+      }).then(async () => {
+        let res = await this.$http.UserService.cashout(type)
+        if(res !== -1){
+          this.getMemberInfo()
+        }
+      }).catch(() => {
+        // on cancel
+      });
+    }
+
+    // 获取资金信息
+    private async getMemberInfo(): Promise<void> {
+      let res = await this.$http.UserService.getMemberInfo()
+      this.userInfo = res
+    }
+  }
+</script>
+<style lang="stylus" scoped>
+  @import "~@assets/stylus/page/fund";
+</style>