activityDet.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <template>
  2. <view v-if="isShow">
  3. <view class="top">
  4. <view class="tops ddflex">
  5. <image :src="detail.pic" mode="aspectFill" class="act-img"></image>
  6. <view class="fflex">
  7. <view class="title tovers">{{detail.title}}</view>
  8. <view class="sta ddflex">
  9. <view class="area fflex ddflex" v-if="detail.address">
  10. <!-- <image src="../static/mine/images/dzico.png"></image> -->
  11. <view class="tover fflex">{{detail.address}}</view>
  12. </view>
  13. <!-- <view class="money"><text>¥</text>{{detail.money}}</view> -->
  14. </view>
  15. </view>
  16. </view>
  17. <view class="date">
  18. <view class="time ddflex"><!-- <image src="../static/mine/images/sjico.png"></image> -->报名时间:{{ detail.enlistStartTime }} - {{ detail.enlistEndTime }}</view>
  19. <view class="time ddflex"><!-- <image src="../static/mine/images/sjico.png"></image> -->活动时间:{{ detail.startTime }} - {{ detail.endTime }}</view>
  20. </view>
  21. <!-- <view class="piao ddflex">
  22. <view class="fflex">总计</view>
  23. <view class="num">x{{detail.enlistExtendDTOS.length}}</view>
  24. <view class="money"><text>¥</text>{{detail.actualMoney}}</view>
  25. </view>
  26. <view class="piao ddflex">
  27. <view class="fflex">实付款</view>
  28. <view class="money"><text>¥</text>{{detail.actualMoney}}</view>
  29. </view> -->
  30. </view>
  31. <view class="infos bgfff">
  32. <view class="tits">报名信息</view>
  33. <view class="li ddflex">
  34. <label>当前状态</label>
  35. <view class="flex" v-if="detail.enlistState == 0">未付款</view>
  36. <view class="flex" v-else>{{detail.enlistState == 2 ? '报名成功' : '报名失败'}}</view>
  37. </view>
  38. <view class="li ddflex">
  39. <label>活动时间</label>
  40. <view class="flex">{{detail.startTime}}</view>
  41. </view>
  42. <view class="li ats ddflex" v-if="detail.address">
  43. <label>活动地址</label>
  44. <view class="flex">{{detail.address}}</view>
  45. </view>
  46. <view class="li ats ddflex">
  47. <label>报名人员</label>
  48. <view class="flex">
  49. <view class="lis" v-for="(item,index) in detail.enlistExtendDTOS" :key="index">{{item.name}}{{item.phone}}</view>
  50. </view>
  51. </view>
  52. </view>
  53. <!-- <view class="infos bgfff">
  54. <view class="tits">订单信息</view>
  55. <view class="li ddflex">
  56. <label>订单编号</label>
  57. <view class="flex">{{detail.orderId}}</view>
  58. </view>
  59. <view class="li ddflex">
  60. <label>支付时间</label>
  61. <view class="flex">{{detail.createDate}}</view>
  62. </view>
  63. </view> -->
  64. <view class="btn" v-if="detail.enlistState == 0" @click="payOrder(options.orderId)">立即付款</view>
  65. </view>
  66. </template>
  67. <script>
  68. const req = require('../../utils/request.js');
  69. const api = require('../../utils/api.js');
  70. const util = require('../../utils/util.js');
  71. const requsetmessage = require('../../utils/requestmessage.js');
  72. const app = getApp();
  73. export default {
  74. components: {
  75. },
  76. data() {
  77. return {
  78. isShow: false,
  79. options: {},
  80. detail: {},
  81. isAdd: false,
  82. personList: [],
  83. name: '',
  84. phone: ''
  85. };
  86. },
  87. onLoad(options) {
  88. this.options = options;
  89. if(req.getStorage('personList')){
  90. this.personList = req.getStorage('personList')
  91. }
  92. },
  93. onShow() {
  94. this.getData(true);
  95. },
  96. methods: {
  97. getData(isShow){
  98. req.getRequest('/api/match/enlist/detailV2',{id: this.options.id},res => {
  99. this.detail = res;
  100. this.isShow = true;
  101. req.saveBehaviorNew(this.detail.matchId,7,4)
  102. },isShow);
  103. },
  104. formatTimeCommStr(dataStr) {
  105. return util.formatTimeCommStr(dataStr, 'M/D');
  106. },
  107. jumpUrl(url){
  108. uni.navigateTo({
  109. url: url
  110. })
  111. },
  112. async payOrder(id){
  113. await requsetmessage.remindActivity().then(res => {});
  114. req.payOrders(id,success =>{
  115. this.getData();
  116. })
  117. }
  118. }
  119. };
  120. </script>
  121. <style>
  122. @import "./activityDet.css";
  123. </style>