金诚优选前端代码
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.

159 lines
4.2 KiB

  1. <template>
  2. <view class="seckill-box" :style="{marginBottom: meta.margin_bottom + 'px',background: meta.background_color}" v-if="indexData && indexData.length">
  3. <view class="title" data-src="/pages/store/seckill/seckill" @tap="_jumpImg">
  4. <span>限时秒杀</span>
  5. <span>
  6. 更多
  7. <text class="iconfont icon-gengduo"></text>
  8. </span>
  9. </view>
  10. <view v-for="(item, index) in indexData" :key="index" >
  11. <view class="seckill-info" :data-id="item.associate.goods.id" @tap="_jumpToDetail">
  12. <view class="left">
  13. <image :src="item.image"></image>
  14. </view>
  15. <view class="right">
  16. <view class="goods-name">
  17. {{item.associate.goods.name}}
  18. </view>
  19. <view class="price-box">
  20. <text>{{item.associate.seckill_price}}</text>
  21. <text class="old">{{item.associate.goods.sell_price}}</text>
  22. </view>
  23. <view class="seckill-time">
  24. <view>
  25. <seckill :end="item.associate.ends_at" :starts="item.associate.starts_at" :server="server" mold="index" @starts="isStarts" @end="isEnd" :data-index="index" :data-idx="bigIndex"></seckill>
  26. </view>
  27. <view :style="'background: ' + config.mainColor" class="buy">
  28. 去抢购
  29. </view>
  30. </view>
  31. </view>
  32. </view>
  33. </view>
  34. </view>
  35. </template>
  36. <script>
  37. import seckill from "../seckill/seckill";
  38. export default {
  39. data() {
  40. return {};
  41. },
  42. components: {
  43. seckill
  44. },
  45. options: {
  46. addGlobalClass: true
  47. },
  48. props: {
  49. indexData: {
  50. type: Array,
  51. value: ''
  52. },
  53. config: {
  54. type: null,
  55. value: ''
  56. },
  57. server: {
  58. type: String,
  59. value: ''
  60. },
  61. bigIndex: {
  62. type: Number,
  63. value: ''
  64. },
  65. meta: {
  66. type: Object,
  67. value: ""
  68. }
  69. },
  70. //组件的方法
  71. methods: {
  72. //
  73. _jumpImg(e) {
  74. var src = e.currentTarget.dataset.src;
  75. if (!src || src == 'uto_miniprogram') return;
  76. wx.navigateTo({
  77. url: src
  78. });
  79. },
  80. _jumpToDetail(e) {
  81. var id = e.currentTarget.dataset.id;
  82. wx.navigateTo({
  83. url: `/pages/store/detail/detail?id=${id}`
  84. });
  85. },
  86. // 秒杀结束
  87. isEnd(e) {
  88. var index = e.index;
  89. var idx = e.idx;
  90. var myEventDetail = {
  91. index: index,
  92. idx: idx
  93. };
  94. // this.setData({
  95. // [`indexData[${index}].associate.seckill`]: null
  96. // })
  97. this.indexData[index]={associate:{seckill:null}};
  98. this.$emit('endevent', myEventDetail);
  99. },
  100. // 秒杀开始
  101. isStarts(e) {
  102. var index = e.index;
  103. var idx = e.idx;
  104. var myEventDetail = {
  105. index: index,
  106. idx: idx
  107. };
  108. if(this.indexData[index]==undefined||
  109. this.indexData[index].associate==undefined ||
  110. this.indexData[index].associate.init_status==undefined ||
  111. this.indexData[index].associate.init_status != 1){
  112. // this.setData({
  113. // [`indexData[${index}].associate.seckill.init_status`]:1
  114. // })
  115. this.indexData[index]={associate:{init_status:1}};
  116. }
  117. this.$emit('startevent', myEventDetail);
  118. },
  119. setData: function (obj) {
  120. let that = this;
  121. let keys = [];
  122. let val, data;
  123. Object.keys(obj).forEach(function (key) {
  124. keys = key.split('.');
  125. val = obj[key];
  126. data = that.$data;
  127. keys.forEach(function (key2, index) {
  128. if (index + 1 == keys.length) {
  129. that.$set(data, key2, val);
  130. } else {
  131. if (!data[key2]) {
  132. that.$set(data, key2, {});
  133. }
  134. }
  135. data = data[key2];
  136. });
  137. });
  138. }
  139. },
  140. };
  141. </script>
  142. <style rel="stylesheet/less" lang="less">
  143. @import "index-seckill";
  144. </style>