library.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. <template>
  2. <view class="page-lib-index" v-if="donateInfo">
  3. <uni-nav-bar :fixed="true" height="160rpx" left-icon="home" backgroundColor="rgb(0,0,0,0)" :border="false" @clickLeft="onHome" color="white"/>
  4. <view class="school-item">
  5. <view class="process">
  6. <view class="heart">{{heart}}</view>
  7. <view class="process-txt">
  8. <view class="bg"></view>
  9. <view class="bar">
  10. <view class="p" :style="{width:heart+'%'}"></view>
  11. </view>
  12. </view>
  13. </view>
  14. <view class="content">
  15. <view class="bg"></view>
  16. <view class="user">
  17. <view class="left">
  18. <view class="header">
  19. <image class="img" :src="donateInfo.user.avatar" mode="scaleToFill"></image>
  20. </view>
  21. <view class="info">
  22. <view class="text">已拥有:{{donateInfo.user.integral}}爱心币</view>
  23. <view class="text">已捐赠:{{donateInfo.user.integral_donate}}爱心币</view>
  24. </view>
  25. </view>
  26. <view class="right">
  27. <button class="btn active" @click="onOpenKey">
  28. <uni-icons type="heart-filled" color="#FFF" size="12"></uni-icons>
  29. 我要损赠
  30. </button>
  31. </view>
  32. </view>
  33. <view class="item-list">
  34. <view class="items">
  35. <view class="heart_total" >总共已添加了:{{donateInfo.info.current_num}}块砖块,还需要:{{donateInfo.info.total_num-donateInfo.info.current_num}}块砖</view>
  36. <block v-for="(it,index) in donateInfo.list ">
  37. <view class="item">
  38. <view class="date">{{it.createTime}}</view>
  39. <view class="name">{{it.content}}</view>
  40. <view class="qty">+{{it.num}}</view>
  41. </view>
  42. </block>
  43. </view>
  44. </view>
  45. <view class="donate" v-if="donateInfo.list.length<=0">
  46. <view class="mid">还没有捐赠记录哦!!!</view>
  47. </view>
  48. </view>
  49. </view>
  50. <uni-popup ref="popKey">
  51. <DonateKeyForm :info="donateInfo" :storeId="store_id" @onSuccess="onSuccess"></DonateKeyForm>
  52. </uni-popup>
  53. </view>
  54. </template>
  55. <script>
  56. import {
  57. mapState,
  58. mapGetters,
  59. mapMutations
  60. } from 'vuex'
  61. const app = getApp();
  62. let hideLoading = true;
  63. import DonateKeyForm from '@/components/DonateKeyForm/DonateKeyForm.vue'
  64. import SchoolUserHeader from '@/components/SchoolUserHeader/SchoolUserHeader.vue'
  65. export default {
  66. components:{
  67. DonateKeyForm,
  68. SchoolUserHeader
  69. },
  70. computed: {
  71. ...mapState(['store_id','systemInfo','userInfo'])
  72. },
  73. data() {
  74. return {
  75. dataList:[{
  76. id:1,
  77. }],
  78. donateInfo:null,
  79. heart:0,
  80. };
  81. },
  82. onShow(){
  83. this.$store.dispatch('getOpenid', this.store_id);
  84. this.initDonate();
  85. },
  86. methods:{
  87. onHome(e){
  88. uni.switchTab({
  89. url:'/pages/home/home'
  90. })
  91. },
  92. onSuccess(e){
  93. this.$refs.popKey.close();
  94. this.initDonate();
  95. },
  96. initDonate(){
  97. let _this=this;
  98. this.$http.request('donate/getInfo', {
  99. type:2,
  100. userId: this.userInfo.id,
  101. }, "", "", hideLoading).then(res => {
  102. _this.donateInfo=res.data;
  103. _this.initHeart();
  104. }).catch(err => {})
  105. },
  106. //初始化百分比
  107. initHeart(){
  108. let _this=this;
  109. let percent=0;
  110. if(_this.donateInfo.info.total_num>0){
  111. percent=_this.donateInfo.info.current_num/_this.donateInfo.info.total_num;
  112. }
  113. _this.heart=parseFloat(percent*100).toFixed(2);
  114. },
  115. onOpenKey(e){
  116. this.$refs.popKey.open("bottom");
  117. },
  118. }
  119. }
  120. </script>
  121. <style lang="scss">
  122. @import "./library.scss"
  123. </style>