todayIncome.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <template>
  2. <view>
  3. <u-calendar v-model="timeShow" mode="date" @change="change"></u-calendar>
  4. <view class="bg-img" style="background-image: url('https://upload-file-data.obs.cn-south-1.myhuaweicloud.com/e997d05cc3514ad7b1bdfd71e3798a7d-bg-img1.png');width: 100%;height: 530upx;">
  5. <view class="flex justify-center align-center" style="padding-top: 80upx;">
  6. <view class="flex justify-center text-bold" style="width: 200upx;font-size: 34upx;" @click="current = 0">
  7. <view :class="current == 0 ? 'text-white' : 'text-gray'">已到账</view>
  8. </view>
  9. <view class="flex justify-center text-bold" style="width: 200upx;font-size: 34upx;" @click="current = 1">
  10. <view :class="current == 1 ? 'text-white' : 'text-gray'">未到账</view>
  11. </view>
  12. </view>
  13. <view class="text-white text-lg" style="padding: 70upx 40upx;" @click="timeShow = true">
  14. <text>{{time}}</text>
  15. <text class="padding-left-xs cuIcon-unfold"></text>
  16. </view>
  17. <view class="text-gray padding-left-lg">收益未到账合计:</view>
  18. <view class="text-white text-bold padding-left-lg" style="font-size: 80upx;margin: 30upx 0;">{{total}}</view>
  19. </view>
  20. <view class="margin-top bg-white">
  21. <view class="padding">{{current == 0 ? '到账收益记录' : '未到账记录'}}</view>
  22. <block v-for="(item, index) in incomeList" :key="index">
  23. <view class="flex justify-between align-center padding" @click="detail(item.id)">
  24. <view class="flex align-center">
  25. <image class="margin-right" src="/static/agent/icon-withdraw.png" style="width: 70upx;height: 70upx;"></image>
  26. <view class="text-bold text-black">{{item.type}}</view>
  27. </view>
  28. <view>
  29. <view class="text-bold text-lg margin-bottom-xs text-black flex justify-end">+{{item.income}}</view>
  30. <view class="text-gray text-sm flex justify-end">{{item.time}}</view>
  31. </view>
  32. </view>
  33. </block>
  34. </view>
  35. </view>
  36. </template>
  37. <script>
  38. export default {
  39. data() {
  40. return {
  41. timeShow: false,
  42. current: 0,
  43. time: '2021年6月25日',
  44. total: 2666.01,
  45. incomeList: [
  46. {id:'1', type: '代理收益', time: '6月11日 10:42', income: '5700.00'},
  47. {id:'2', type: '代理收益', time: '6月11日 10:42', income: '5700.00'},
  48. {id:'3', type: '代理收益', time: '6月11日 10:42', income: '5700.00'},
  49. {id:'4', type: '代理收益', time: '6月11日 10:42', income: '5700.00'},
  50. {id:'5', type: '代理收益', time: '6月11日 10:42', income: '5700.00'},
  51. {id:'6', type: '代理收益', time: '6月11日 10:42', income: '5700.00'}
  52. ],
  53. }
  54. },
  55. onLoad() {
  56. this.getLocalDate();
  57. },
  58. methods: {
  59. getLocalDate() {
  60. let time = new Date().toLocaleDateString().split('/');
  61. this.time = time[0] + '年' + time[1] + '月' + time[2] + '日';
  62. },
  63. detail(id) {
  64. uni.navigateTo({
  65. url: '/pages/activityList/mine/agent/myIncome/detail?id=' + id
  66. })
  67. },
  68. change(e) {
  69. this.time = e.year + '年' + e.month + '月' + e.day + '日'
  70. }
  71. }
  72. }
  73. </script>
  74. <style>
  75. </style>