cm-price.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <template name="cm-price">
  2. <!-- 商品详情价格判断 -->
  3. <view class="wrap-main">
  4. <template v-if="!hasLogin">
  5. <view class="p-login grade tui-skeleton-fillet">
  6. <text class="p-no">¥</text>
  7. <uni-grader :grade="Number(product.priceGrade)"></uni-grader>
  8. <view class="floor-item-btn"> <view class="btn" @click.stop="loginClick">登录查看价格</view> </view>
  9. </view>
  10. </template>
  11. <template v-else>
  12. <view class="wrap-main-item">
  13. <view class="p-price tui-skeleton-fillet">
  14. <text class="txt sm">¥</text>
  15. <text class="txt big">{{ product.price | NumFormat}}</text>
  16. </view>
  17. </view>
  18. </template>
  19. </view>
  20. </template>
  21. <script>
  22. import { mapState, mapMutations } from 'vuex'
  23. import uniGrader from '@/components/uni-grade/uni-grade.vue'
  24. export default {
  25. name: 'cm-price',
  26. components: {
  27. uniGrader
  28. },
  29. props: {
  30. product: {
  31. type: Object
  32. }
  33. },
  34. data() {
  35. return {
  36. popupShow: false,
  37. isIphoneX: this.$store.state.isIphoneX,
  38. }
  39. },
  40. filters: {
  41. NumFormat: function(text) {
  42. //处理金额
  43. return Number(text).toFixed(2)
  44. }
  45. },
  46. created() {
  47. },
  48. computed: {
  49. ...mapState(['hasLogin', 'clubType']),
  50. },
  51. methods: {
  52. hidePopup() {
  53. this.popupShow = false
  54. },
  55. loginClick() {
  56. this.$api.navigateTo('/pages/login/login')
  57. }
  58. }
  59. }
  60. </script>
  61. <style lang="scss">
  62. .tui-flex-1 {
  63. flex: 1;
  64. }
  65. </style>