index.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. <template>
  2. <view class="page" :style="{'height':windowHeight}">
  3. <view class="flex-col" v-if="!equityList">
  4. <view class="flex-row justify-center">
  5. <image class="empty" src="/static/imageIcon/empty.png" mode="widthFix"></image>
  6. </view>
  7. <view class="emptyText flex-row justify-center">
  8. <text>暂无内容</text>
  9. </view>
  10. </view>
  11. <scroll-view v-else scroll-y :style="{'height':windowHeight}">
  12. <view class="row-list" v-for="(item,index) in equityList" :key="index">
  13. <view class="flex-row justify-start" @click.stop="showRemark(item)">
  14. <view class="h-text flex-col justify-center ">
  15. <view class="money">
  16. <text>{{item.faceValue}}</text>
  17. </view>
  18. <!-- <view class="desc">-->
  19. <!-- <text>{{item.title}}</text>-->
  20. <!-- </view>-->
  21. <view class="flex-row justify-center" v-if="item.isShow">
  22. <text style="font-size: 28rpx;font-weight: bold;color: red;" @click="navigateTo(item)">点击续费</text>
  23. </view>
  24. </view>
  25. <view class="h-center-content flex-col justify-around ">
  26. <view class="h-value">
  27. <text>{{item.title}}</text>
  28. </view>
  29. <view class="title">
  30. 适用项目:{{item.serviceProjectName || ''}}
  31. </view>
  32. <view class="title">
  33. 适用门店:{{ item.useStoreDesc || '' }}
  34. </view>
  35. <view class="title">
  36. 绑定对象:{{item.serviceObjectName}}
  37. </view>
  38. <view class="title">
  39. 结束期限:{{item.effectiveEndTime.substring(0,10)}}
  40. </view>
  41. </view>
  42. <view class=" flex-col justify-center ">
  43. <image class="h-right-content-img " :src="item.facePhotoUrl || '/static/logo.png'" mode="aspectFit" @click="magnify(item.facePhotoUrl)"></image>
  44. </view>
  45. </view>
  46. <view v-if="showRemarkId == item.id" class="remark" style="text-indent:unset">
  47. <view v-if="item.description !=null">
  48. 使用说明:
  49. <text>{{ item.description }}</text>
  50. </view>
  51. <text v-else class="remarkText">该优惠券暂无使用说明</text>
  52. </view>
  53. </view>
  54. </scroll-view>
  55. <uni-popup ref="popup">
  56. <view class="magnifyUrlView">
  57. <image :src="magnifyUrl" mode="widthFix"></image>
  58. </view>
  59. </uni-popup>
  60. </view>
  61. </template>
  62. <script>
  63. import {date} from "@/uni_modules/uv-ui-tools/libs/function/test";
  64. export default {
  65. data() {
  66. return {
  67. showRemarkId:'',
  68. magnifyUrl:'',
  69. windowHeight:'',
  70. userInfo:{},
  71. equityList:[],
  72. };
  73. },
  74. onLoad(option) {
  75. let sysInfo = uni.getSystemInfoSync()
  76. this.windowHeight =sysInfo.windowHeight - 3 +'px'//除标题栏栏外的屏幕可用高度
  77. this.userInfo = uni.getStorageSync('userInfo')
  78. this.myEquityCardList()
  79. },
  80. methods: {
  81. isShow(item){
  82. if (item.effectiveEndTime){
  83. let date = new Date(item.effectiveEndTime);
  84. let now = new Date().getTime();
  85. const timeDiff = Math.abs(now - date.getTime());
  86. const ninetyDaysMs = 90 * 24 * 60 * 60 * 1000;
  87. return timeDiff < ninetyDaysMs;
  88. }
  89. return false
  90. },
  91. navigateTo(item){
  92. if(item.activityId){
  93. let list = item.activityId.split(',')
  94. if (list.length == 1){
  95. uni.navigateTo({
  96. url:'/orderPages/activityDetail/activityDetail?id=' + item.activityId
  97. })
  98. }else {
  99. uni.navigateTo({
  100. url:'/orderPages/activityList/activityList'
  101. })
  102. }
  103. }else{
  104. uni.navigateTo({
  105. url:'/orderPages/activityList/activityList'
  106. })
  107. }
  108. },
  109. showRemark(item) {
  110. if (this.showRemarkId == item.id) {
  111. this.showRemarkId = ''
  112. } else {
  113. this.showRemarkId = item.id
  114. }
  115. },
  116. magnify(url){
  117. if (!url){
  118. return
  119. }
  120. this.magnifyUrl = url
  121. this.$refs.popup.open()
  122. },
  123. myEquityCardList(){
  124. this.$api.myEquityCardList().then(res=>{
  125. console.log(res)
  126. this.equityList = res.data.data
  127. for (let equityListElement of this.equityList) {
  128. let a = this.isShow(equityListElement)
  129. console.log(a)
  130. equityListElement.isShow = this.isShow(equityListElement)
  131. }
  132. if (this.equityList){
  133. this.getImgUrlByBannerOssId(this.equityList)
  134. }
  135. })
  136. },
  137. // 获取图片
  138. getImgUrlByBannerOssId(items){
  139. for(let i = 0; i <items.length; i++) {
  140. if (items[i].facePhoto){
  141. this.$api.getImgUrlByOssId({ossId:items[i].facePhoto}).then(res=>{
  142. console.log('++++++++++++facePhotoUrl+++++++++',res.data.data[0].url.replace(/^http:/, "https:"))
  143. items[i].facePhotoUrl = res.data.data[0].url.replace(/^http:/, "https:")
  144. this.$set(this.equityList,i,items[i])
  145. })
  146. }
  147. }
  148. },
  149. },
  150. };
  151. </script>
  152. <style lang="scss" scoped>
  153. @import '/common/css/common.css';
  154. @import './index.rpx.scss';
  155. </style>