index.vue 3.5 KB

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