index.vue 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262
  1. <template>
  2. <view class="orderGoods" :style="viewColor">
  3. <view class='goodWrapper'>
  4. <view class="title">共{{cartInfo.length}}件商品</view>
  5. <view v-for="(item,index) in cartInfo" :key="index">
  6. <view class='item acea-row row-between-wrapper'>
  7. <view class='pictrue' @click="jumpCon(item.product_id)">
  8. <image :src='(item.cart_info.productAttr && item.cart_info.productAttr.image) || item.cart_info.product.image' ></image>
  9. </view>
  10. <view class='text'>
  11. <view class='acea-row row-between-wrapper'>
  12. <view class='name line1'>{{item.cart_info.product.store_name}}</view>
  13. <view class='num'>x {{item.product_num}}</view>
  14. </view>
  15. <view class='attr line1' v-if="item.cart_info.productAttr.sku">{{item.cart_info.productAttr.sku}}</view>
  16. <view class='money' >¥{{item.cart_info.productAttr.price}}</view>
  17. </view>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. </template>
  23. <script>
  24. // +----------------------------------------------------------------------
  25. // | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
  26. // +----------------------------------------------------------------------
  27. // | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
  28. // +----------------------------------------------------------------------
  29. // | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
  30. // +----------------------------------------------------------------------
  31. // | Author: CRMEB Team <admin@crmeb.com>
  32. // +----------------------------------------------------------------------
  33. import { openOrderRefundSubscribe } from '@/utils/SubscribeMessage.js';
  34. import { mapGetters } from "vuex";
  35. export default {
  36. props: {
  37. evaluate: {
  38. type: Number,
  39. default: 0,
  40. },
  41. activityType: {
  42. type: Number,
  43. default: 0,
  44. },
  45. cartInfo: {
  46. type: Array,
  47. default: function() {
  48. return [];
  49. }
  50. },
  51. orderId: {
  52. type: String,
  53. default: '',
  54. },
  55. jump: {
  56. type: Boolean,
  57. default: false,
  58. },
  59. orderData: {
  60. type: Object,
  61. default: function() {
  62. return {};
  63. }
  64. }
  65. },
  66. computed: mapGetters(['viewColor']),
  67. data() {
  68. return {
  69. totalNmu:'',
  70. isTimePay: false, //是否到支付时间
  71. };
  72. },
  73. watch:{
  74. cartInfo:function(nVal,oVal){
  75. let num = 0
  76. nVal.forEach((item,index)=>{
  77. num += item.cart_num
  78. })
  79. this.totalNmu = num
  80. }
  81. },
  82. onShow() {
  83. this.isPayBalance()
  84. },
  85. mounted() {},
  86. methods: {
  87. evaluateTap:function(unique,orderId){
  88. uni.navigateTo({
  89. url:`/pages/users/goods_comment_con/index?uni=${unique}&order_id=${orderId}`
  90. })
  91. },
  92. // 判断是否到支付尾款时间
  93. isPayBalance(){
  94. let that = this;
  95. if(that.orderData.status === 10){
  96. if(new Date() < new Date(that.orderData.presellOrder.final_start_time)){
  97. that.isTimePay = false; //未开始
  98. }else if((new Date() >= new Date(that.orderData.presellOrder.final_start_time)) && (new Date() <= new Date(that.orderData.presellOrder.final_start_time)) ){
  99. that.isTimePay = true; //立即支付
  100. }
  101. }
  102. },
  103. jumpCon:function(id){
  104. if(this.jump){
  105. if(this.activityType == 2){
  106. uni.navigateTo({
  107. url: `/pages/activity/presell_details/index?id=${id}`
  108. })
  109. }else{
  110. uni.navigateTo({
  111. url: `/pages/goods_details/index?id=${id}`
  112. })
  113. }
  114. }
  115. },
  116. // 退款
  117. refund(item){
  118. // #ifdef MP
  119. openOrderRefundSubscribe().then(() => {
  120. uni.hideLoading();
  121. if(this.evaluate == 0){
  122. uni.navigateTo({
  123. url:'/pages/users/refund/confirm?order_id='+this.orderId+'&type=1'+'&ids='+item.order_product_id+'&refund_type=1'
  124. })
  125. }else{
  126. uni.navigateTo({
  127. url:'/pages/users/refund/select?order_id='+this.orderId+'&type=1'+'&ids='+item.order_product_id
  128. })
  129. }
  130. }).catch(() => {
  131. uni.hideLoading();
  132. })
  133. // #endif
  134. // #ifdef H5
  135. if(this.evaluate == 0){
  136. uni.navigateTo({
  137. url:'/pages/users/refund/confirm?order_id='+this.orderId+'&type=1'+'&ids='+item.order_product_id+'&refund_type=1'
  138. })
  139. }else{
  140. uni.navigateTo({
  141. url:'/pages/users/refund/select?order_id='+this.orderId+'&type=1'+'&ids='+item.order_product_id
  142. })
  143. }
  144. // #endif
  145. }
  146. }
  147. }
  148. </script>
  149. <style scoped lang="scss">
  150. .orderGoods {
  151. background-color: #fff;
  152. }
  153. .goodWrapper{
  154. margin-top: 12rpx;
  155. .title{
  156. padding: 0 32rpx;
  157. border-bottom: 1px solid #f0f0f0;
  158. height: 86rpx;
  159. line-height: 86rpx;
  160. }
  161. }
  162. .right-btn-box{
  163. position: absolute;
  164. right: 0;
  165. bottom: 0;
  166. display: flex;
  167. align-items: center;
  168. justify-content: flex-end;
  169. &.event_box{
  170. position: static;
  171. }
  172. .btn-item{
  173. display: flex;
  174. align-items: center;
  175. justify-content: center;
  176. width:140rpx;
  177. height:46rpx;
  178. margin-left: 20rpx;
  179. border:1px solid rgba(187,187,187,1);
  180. border-radius:23rpx;
  181. font-size: 24rpx;
  182. color: #282828;
  183. &.on{
  184. background:rgba(220,220,220,1);
  185. border-color: rgba(220,220,220,1);
  186. }
  187. &.err{
  188. background:rgba(247,247,247,1);
  189. border-color: rgba(247,247,247,1);
  190. color: #AAAAAA;
  191. }
  192. }
  193. }
  194. .event_bg{
  195. background: #FF7F00;
  196. }
  197. .event_color{
  198. color: #FF7F00;
  199. }
  200. .money {
  201. color: var(--view-priceColor);
  202. }
  203. .presell_item{
  204. height: auto;
  205. padding-bottom: 15rpx;
  206. }
  207. .event_progress{
  208. margin-top: 20rpx;
  209. background: #fff;
  210. .progress_name {
  211. padding-left: 30rpx;
  212. height: 60rpx;
  213. line-height: 60rpx;
  214. font-size: 24rpx;
  215. font-weight: bold;
  216. position: relative;
  217. &::before{
  218. content: "";
  219. display: inline-block;
  220. width: 5rpx;
  221. height: 34rpx;
  222. background: #E93323;
  223. position: absolute;
  224. top: 15rpx;
  225. left: 0;
  226. }
  227. }
  228. .align_right{
  229. float: right;
  230. font-weight: bold;
  231. }
  232. .progress_price{
  233. padding: 20rpx 30rpx;
  234. color: #999999;
  235. font-size: 22rpx;
  236. }
  237. .progress_pay{
  238. padding: 25rpx 30rpx;
  239. background: var(--view-minorColor);
  240. font-size: 26rpx;
  241. color: #282828;
  242. }
  243. }
  244. .event_name{
  245. display: inline-block;
  246. margin-right: 9rpx;
  247. color: #fff;
  248. font-size: 20rpx;
  249. padding: 0 8rpx;
  250. line-height: 30rpx;
  251. text-align: center;
  252. border-radius: 6rpx;
  253. }
  254. .event_ship{
  255. font-size: 20rpx;
  256. margin-top: 10rpx;
  257. }
  258. </style>