goodItem.vue 1001 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <view class="gl-item" @click="$navigateTo('/subPages/shopPage/good/good?id='+item.id)">
  3. <view class="gl-img">
  4. <uv-image width="170rpx" height="170rpx" :src="shopImage(item.pic)">
  5. </uv-image>
  6. </view>
  7. <view>
  8. <view class="gl-name">{{item.name}}</view>
  9. <view class="gl-descript">{{item.descript}}</view>
  10. <view class="gl-price">¥{{formatPrice(item.price)}}</view>
  11. </view>
  12. </view>
  13. </template>
  14. <script>
  15. export default {
  16. props: ['item'],
  17. methods: {
  18. formatPrice(price) {
  19. if (!price) return 0;
  20. return (price / 100).toFixed(2);
  21. }
  22. }
  23. }
  24. </script>
  25. <style lang="scss" scoped>
  26. .gl-item {
  27. width: 100%;
  28. display: flex;
  29. align-items: center;
  30. }
  31. .gl-img {
  32. width: 170rpx;
  33. height: 170rpx;
  34. margin-right: 30rpx;
  35. }
  36. .gl-name {
  37. font-size: 32rpx;
  38. font-weight: bold;
  39. }
  40. .gl-descript {
  41. font-size: 24rpx;
  42. }
  43. .gl-price {
  44. font-size: 32rpx;
  45. color: #FA3534;
  46. margin-top: 20rpx;
  47. }
  48. </style>