userTui.vue 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. <template>
  2. <view class="my-promotion">
  3. <view class="header">
  4. <image class="bg" src="../../static/images/bg_1.png"></image>
  5. <view class="name acea-row row-center-wrapper">
  6. <view>累计佣金</view>
  7. </view>
  8. <view class="num">{{ brokeragePrice }}</view>
  9. <view class="profit acea-row row-between-wrapper">
  10. <view class="item">
  11. <view>昨日收益</view>
  12. <view class="money">{{ yesterdayMoney }}</view>
  13. </view>
  14. <view class="item" @click="navgetTo('userTuiExtractLog')">
  15. <view>
  16. 提现记录
  17. </view>
  18. </view>
  19. </view>
  20. </view>
  21. <view class="list acea-row row-between-wrapper">
  22. <view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiImg')">
  23. <image class="icon" src="../../static/images/tui_1.png"></image>
  24. <view>推广名片</view>
  25. </view>
  26. <view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiProduct')">
  27. <image class="icon" src="../../static/images/products_icon.png"></image>
  28. <view>推广商品</view>
  29. </view>
  30. <view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiList')">
  31. <image class="icon" src="../../static/images/statistics-icon.png"></image>
  32. <view>推广人统计</view>
  33. </view>
  34. <view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiMoneyList')">
  35. <image class="icon" src="../../static/images/commission_icon.png"></image>
  36. <view>佣金明细</view>
  37. </view>
  38. <view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiOrderList')">
  39. <image class="icon" src="../../static/images/order_icon.png"></image>
  40. <view>推广人订单</view>
  41. </view>
  42. <view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiMoney')">
  43. <image class="icon" src="../../static/images/cash_icon.png"></image>
  44. <view>提现管理</view>
  45. </view>
  46. </view>
  47. </view>
  48. </template>
  49. <script>
  50. import {getTuiMoney} from '@/api/user'
  51. export default {
  52. name: "UserTui",
  53. components: {},
  54. props: {},
  55. data: function() {
  56. return {
  57. brokeragePrice: 0,
  58. yesterdayMoney: 0
  59. };
  60. },
  61. mounted: function() {
  62. this.getTuiMoney();
  63. },
  64. methods: {
  65. getTuiMoney: function () {
  66. let that = this;
  67. getTuiMoney().then(
  68. res => {
  69. that.brokeragePrice=res.brokeragePrice+res.nowMoney;
  70. that.yesterdayMoney=res.yesterdayMoney;
  71. },
  72. err => {
  73. uni.showToast({
  74. title: err.msg,
  75. icon: "none",
  76. duration: 2000
  77. });
  78. },
  79. 300
  80. );
  81. },
  82. navgetTo(url) {
  83. this.utils.isLogin().then(res => {
  84. if(res){
  85. uni.navigateTo({
  86. url: url
  87. })
  88. }
  89. })
  90. },
  91. }
  92. };
  93. </script>
  94. <style lang="less">
  95. /*我的推广*/
  96. .my-promotion .header {
  97. position: relative;
  98. width: 100%;
  99. height: 3.75 * 100rpx;
  100. }
  101. .my-promotion .header .bg{
  102. position: absolute;
  103. width: 100%;
  104. height: 3.75 * 100rpx;
  105. }
  106. .my-promotion .header .name {
  107. font-size: 0.3 * 100rpx;
  108. color: #fff;
  109. padding-top: 0.57 * 100rpx;
  110. position: relative;
  111. }
  112. .my-promotion .header .name .record {
  113. font-size: 0.26 * 100rpx;
  114. color: rgba(255, 255, 255, 0.8);
  115. position: absolute;
  116. right: 0.2 * 100rpx;
  117. }
  118. .my-promotion .header .name .record .iconfont {
  119. font-size: 0.25 * 100rpx;
  120. margin-left: 0.1 * 100rpx;
  121. }
  122. .my-promotion .header .num {
  123. position: relative;
  124. text-align: center;
  125. color: #fff;
  126. // margin-top: 0.25*100rpx;
  127. font-size: 0.9 * 100rpx;
  128. font-family: 'GuildfordProBook 5';
  129. }
  130. .my-promotion .header .profit {
  131. position: relative;
  132. padding: 0 0.2 * 100rpx;
  133. margin-top: 0.33 * 100rpx;
  134. font-size: 0.24 * 100rpx;
  135. color: rgba(255, 255, 255, 0.8);
  136. }
  137. .my-promotion .header .profit .item {
  138. min-width: 2 * 100rpx;
  139. text-align: center;
  140. }
  141. .my-promotion .header .profit .item .money {
  142. font-size: 0.34 * 100rpx;
  143. color: #fff;
  144. }
  145. .my-promotion .bnt {
  146. font-size: 0.28 * 100rpx;
  147. color: #fff;
  148. width: 2.58 * 100rpx;
  149. height: 0.68 * 100rpx;
  150. border-radius: 0.5 * 100rpx;
  151. text-align: center;
  152. line-height: 0.68 * 100rpx;
  153. margin: -0.32 * 100rpx auto 0 auto;
  154. }
  155. .my-promotion .list {
  156. padding: 0 0.2 * 100rpx;
  157. margin-top: 0.1 * 100rpx;
  158. }
  159. .my-promotion .list .item {
  160. width: 3.45 * 100rpx;
  161. height: 2.4 * 100rpx;
  162. border-radius: 0.2 * 100rpx;
  163. background-color: #fff;
  164. margin-top: 0.2 * 100rpx;
  165. font-size: 0.3 * 100rpx;
  166. color: #666;
  167. }
  168. .my-promotion .list .item .icon {
  169. width: 80rpx;
  170. height: 80rpx;
  171. margin-bottom: 10rpx;
  172. }
  173. </style>