C端小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

145 line
6.6 KiB

  1. <!--pages/spellDetail/index.wxml-->
  2. <navbar back home text="{{barTitle}}" background='#fff'></navbar>
  3. <view class='container' style="margin-top:{{navigationBarHeight}}">
  4. <!-- 拼团产品详情 -->
  5. <view class='detail'>
  6. <view class='return-index' bindtap='gotoIndex'>
  7. <image src='{{home}}' mode="widthFix"></image>
  8. </view>
  9. <view class='detail-top'>
  10. <view class='detail-top01'>
  11. <image src='{{data.coverImg}}' mode="aspectFill"></image>
  12. </view>
  13. <view class='detail-top02'>
  14. <view class='title'>{{data.title}}</view>
  15. <view class='des'>{{data.subTitle}}</view>
  16. </view>
  17. <view class='detail-top03'>
  18. <view class='detail-p-price'>{{data.salePrice}}</view>
  19. <view class='detail-p-name'>「拼团价」¥</view>
  20. </view>
  21. </view>
  22. <view class='detail-bottom' wx:if="{{isMyself==true}}">
  23. <view class='b-price'>{{data.salePrice}}</view>
  24. <view class='b-unit'>¥</view>
  25. <view class='b-name'>实付款</view>
  26. </view>
  27. <image class="frImg" wx:if="{{data.status == 10}}" src="{{orangeImg}}" mode="aspectFill" lazy-load="true"><text>{{data.statustext}}</text></image>
  28. <image class="frImg" wx:if="{{data.status == 11}}" src="{{blueImg}}" mode="aspectFill" lazy-load="true"><text>{{data.statustext}}</text></image>
  29. <image class="frImg" wx:if="{{data.status != 11&&data.status != 10}}" src="{{grayImg}}" mode="aspectFill" lazy-load="true"><text>{{data.statustext}}</text></image>
  30. </view>
  31. <!-- 拼团状态-拼团中,拼团成功 -->
  32. <view class='status' wx:if="{{isMyself==true}}" style='margin-top:30rpx;'>
  33. <view class='status-center' style='{{"width:"+(120*data.userList.length>634?634:120*data.userList.length)+"rpx;"+"margin:0 auto;"}}'>
  34. <view class='status-lists'>
  35. <view class='tuanzhang touxiangitems' wx:for="{{data.userList}}" wx:key="{{index}}">
  36. <view class='touxiang' wx:if='{{item.avatarUrl}}'>
  37. <image src='{{item.avatarUrl}}'></image>
  38. </view>
  39. <view class='tuan-icon' wx:if='{{index==0}}'>
  40. <image src='{{tuanzhang}}'></image>
  41. </view>
  42. <view class='no-touxiang' wx:if='{{!item.avatarUrl}}'>
  43. ?
  44. </view>
  45. </view>
  46. </view>
  47. <!-- <view class='need' >还差 <text class='needNum'>{{data.remainPeople}}人</text>拼团成功,赶快邀人!</view> -->
  48. </view>
  49. <view class='status-top' wx:if='{{data.status==10}}' style="width:332rpx;margin:0 auto;">
  50. <view class='p-text'>结束</view>
  51. <view class='p-time'>{{sec}}</view>
  52. <view class='p-mao'>:</view>
  53. <view class='p-time'>{{min}}</view>
  54. <view class='p-mao'>:</view>
  55. <view class='p-time'>{{hour}}</view>
  56. <view class='p-mao'>天</view>
  57. <view class='p-time'>{{day}}</view>
  58. <view class='p-text'>剩余</view>
  59. </view>
  60. <view class='status-des' wx:if='{{data.status==10}}'>
  61. <view class='p-des'>
  62. <view class='p-des-text'>还差</view>
  63. <view class='p-des-num'>{{data.remainPeople}}人</view>
  64. <view class='p-des-text'>拼团成功,赶快邀人</view>
  65. </view>
  66. </view>
  67. <view class='status-des' wx:if="{{data.status==11&&isMyself==true}}">
  68. <view class='p-des'>
  69. <view class='p-des-num'>拼团成功!</view>
  70. </view>
  71. </view>
  72. <view class='status-des' wx:if="{{data.status==12||data.status==13&&data.couponStatus==0}}">
  73. <view class='p-des'>
  74. <view class='p-des-text' style='color:#ccc;'>拼团失败!</view>
  75. </view>
  76. </view>
  77. <button class='share user-motto' wx:if="{{data.status==10&&isMyself==true&&data.couponStatus==0}}" id="shareBtn" open-type="share">邀请好友拼团</button>
  78. <button class='share user-motto' wx:if="{{data.status==11&&isMyself==true}}" bindtap='gotoUse'>去使用</button>
  79. <button class='share user-motto' wx:if="{{data.status==12||data.status==13&&data.couponStatus==0}}" bindtap='gotoAgain'>重新拼团</button>
  80. <view class='status-bottom'>
  81. <view class='position-icon'>
  82. <image src='{{position}}'></image>
  83. </view>
  84. <view class='position'>广场地址:{{data.addr}}</view>
  85. </view>
  86. </view>
  87. <!-- 拼团状态-除拼团失败,拼团超时 wx:if='{{data.status!=10&&!isMyself}}'-->
  88. <view class='status' wx:if='{{data.status!=10&&!isMyself}}' style='padding:0;overflow:hidden;margin-top:30rpx;'>
  89. <view class='status-center' style='margin:0 20rpx;width:650rpx;box-sizing:border-box;'>
  90. <view class='status-lists' style='{{"width:"+(120*data.userList.length>634?634:120*data.userList.length)+"rpx;"+"margin:0 auto;"}}'>
  91. <view class='tuanzhang touxiangitems' wx:for="{{data.userList}}" wx:key="{{index}}">
  92. <view class='touxiang' wx:if='{{item.avatarUrl}}'>
  93. <image src='{{item.avatarUrl}}'></image>
  94. </view>
  95. <view class='tuan-icon' wx:if='{{index==0}}'>
  96. <image src='{{tuanzhang}}'></image>
  97. </view>
  98. <view class='no-touxiang' wx:if='{{!item.avatarUrl}}'>
  99. ?
  100. </view>
  101. </view>
  102. </view>
  103. </view>
  104. <view class='status-top' style='margin:0 20rpx;width:650rpx;box-sizing:border-box;'>
  105. <view class='p-status' style='text-align:center;width:100%;'>{{data.statustext}}</view>
  106. </view>
  107. <!-- 按钮 -->
  108. <view class='button' style='padding:0 20rpx;'>
  109. <button class='share user-motto' bindtap='gotoshare'>发起拼团</button>
  110. <button class='share user-motto' bindtap='gotoSearch'>更多拼团商品</button>
  111. </view>
  112. <view class='status-bottom' style='padding:0 20rpx;box-sizing:border-box;'>
  113. <view class='position-icon'>
  114. <image src='{{position}}'></image>
  115. </view>
  116. <view class='position'>广场地址:{{data.addr}}</view>
  117. </view>
  118. </view>
  119. <!-- 拼团订单信息 -->
  120. <view class='order'>
  121. <view class='order-list'>
  122. <view class='order-title'>订单编号:</view>
  123. <view class='order-text'>{{paramData.orderId}}</view>
  124. </view>
  125. <view class='order-list'>
  126. <view class='order-title'>团单编号:</view>
  127. <view class='order-text'>{{data.orderGroupId}}</view>
  128. </view>
  129. </view>
  130. <view class='alert-bg' wx:if='{{showAlert&&data.status!=11}}' bindtap='gotoClose'></view>
  131. <view class='alert-box' wx:if='{{showAlert&&data.status!=11}}'>
  132. <view class='alert-close' bindtap='gotoClose'>
  133. <image src='{{close03}}'></image>
  134. </view>
  135. <view class='alert-title'>商品已下架</view>
  136. <view class='alert-button'>
  137. <button class='share user-motto' bindtap='gotoSpellList'>更多拼团商品</button>
  138. </view>
  139. </view>
  140. </view>