groupContent.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <template>
  2. <view class="introduce-section">
  3. <text class="title clamp">
  4. {{goodsObjact.title}}
  5. <!-- <text class="tip-o">截单后8小时到货</text> -->
  6. </text>
  7. <!-- <button open-type="share" class="shareDate flex_item">
  8. <image class="share-img" src="/static/img/img085.png"></image>
  9. <view class="name">分享</view>
  10. </button> -->
  11. <!-- <view class="progress-box">
  12. <progress :percent="goodsObjact.percent | parseIntTo" activeColor="#F65527" font-size="10" show-info border-radius="5" stroke-width="9" />
  13. <view class="number">剩余{{ goodsObjact.percent | parseIntTo }}%</view>
  14. </view> -->
  15. <view class="old_price" v-if="goodsObjact.pink_type == '达人团'">
  16. ¥{{ goodsObjact.product_price }}
  17. </view>
  18. <text class="info" v-if="goodsObjact.store_info">{{ goodsObjact.store_info }}</text>
  19. <!-- <view class="price-green">
  20. ¥{{ goodsObjact.product_price }}
  21. <text>市场价</text>
  22. </view> -->
  23. </view>
  24. </template>
  25. <script>
  26. export default {
  27. props: {
  28. goodsObjact: {
  29. type: Object,
  30. default: function() {
  31. return {
  32. store_info: '',
  33. ot_price: ''
  34. };
  35. }
  36. }
  37. },
  38. data() {
  39. return {};
  40. },
  41. filters: {
  42. parseIntTo(percent) {
  43. percent = +percent * 100;
  44. if (percent % 1 === 0) {
  45. return percent;
  46. } else {
  47. percent = percent.toFixed(1);
  48. return percent;
  49. }
  50. }
  51. },
  52. methods: {
  53. Getcoupon() {
  54. this.$emit('click');
  55. }
  56. }
  57. };
  58. </script>
  59. <style lang="scss">
  60. /* 标题简介 */
  61. .introduce-section {
  62. position: relative;
  63. background: #fff;
  64. padding: 35rpx 0rpx;
  65. padding-left: 35rpx;
  66. .title {
  67. font-size: 32rpx;
  68. color: $font-color-dark;
  69. height: 50rpx;
  70. width: 70%;
  71. font-weight: bold;
  72. .tip-o {
  73. color: #ff3334;
  74. padding-left: 15rpx;
  75. font-size: 25rpx;
  76. }
  77. }
  78. .shareDate {
  79. padding: 15rpx 25rpx;
  80. padding-bottom: 25rpx !important;
  81. position: absolute;
  82. top: 25rpx;
  83. right: 0rpx;
  84. font-size:30rpx;
  85. color: #3d3f46;
  86. border-bottom-left-radius: 25rpx;
  87. border-top-left-radius: 25rpx;
  88. background-color: #ffffff;
  89. height: 60rpx;
  90. background-color:#F2FEE6;
  91. border: none !important;
  92. }
  93. uni-button:after{
  94. border: none !important;
  95. }
  96. .share-img {
  97. width: 45rpx;
  98. height: 45rpx;
  99. position: relative;
  100. top: 5rpx;
  101. left: 0;
  102. margin-right: 10rpx;
  103. }
  104. .name{
  105. position: relative;
  106. top: 5rpx;
  107. }
  108. .progress-box {
  109. width: 260rpx;
  110. position: relative;
  111. margin-top: 15rpx;
  112. line-height: 10px;
  113. .number {
  114. font-size: 17rpx;
  115. position: absolute;
  116. z-index: 999;
  117. top: 3rpx;
  118. left: 15rpx;
  119. color: #ffffff;
  120. }
  121. }
  122. .old_price {
  123. margin-top: 10rpx;
  124. font-size: $font-base;
  125. text-decoration: line-through;
  126. color: #7a7a7a;
  127. }
  128. .info {
  129. color: #999999;
  130. font-size: 26rpx;
  131. padding-bottom: 15rpx;
  132. }
  133. .price-green {
  134. color: #2dbd59;
  135. font-size: 28rpx !important;
  136. text {
  137. background: #2dbd59;
  138. color: #ffffff;
  139. padding: 0rpx 10rpx;
  140. border-radius: 5rpx;
  141. font-size: 22rpx !important;
  142. margin-left: 15rpx;
  143. }
  144. }
  145. }
  146. </style>