DescItem.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <!-- Details.vue -->
  2. <template>
  3. <view class="div show-iframe">
  4. <rich-text class="div mb-body" v-if="detailInfo.plateid_top && detailInfo.plate_top" :nodes='detailInfo.plate_top.storeplate_content'></rich-text>
  5. <view class="div" v-if="!mbBody.length">
  6. <view class="div mb-body" v-if="detailInfo.goods_body">
  7. <rich-text class="div" :nodes='detailInfo.goods_body'></rich-text>
  8. </view>
  9. <view class="div list-empty" v-else>
  10. <view class="div iconfont empty-icon">&#xe636;</view>
  11. <view class="p">本商品暂无详情</view>
  12. </view>
  13. </view>
  14. <view class="div mb-body" v-else>
  15. <view class="div" v-for="(item,index) in mbBody" :key="index">
  16. <view class="p" v-if="item.type=='text'">{{item.value}}</view>
  17. <image mode="widthFix" class="img" v-else :src="item.value">
  18. </view>
  19. </view>
  20. <rich-text class="div mb-body" v-if="detailInfo.plateid_bottom && detailInfo.plate_bottom" :nodes='detailInfo.plate_bottom.storeplate_content'></rich-text>
  21. </view>
  22. </template>
  23. <script>
  24. export default {
  25. data () {
  26. return {}
  27. },
  28. computed: {
  29. getUrl: function () {
  30. return this.url
  31. }
  32. },
  33. props: ['mbBody', 'detailInfo'],
  34. methods: {}
  35. }
  36. </script>
  37. <style lang="scss">
  38. .list-empty {
  39. position: absolute;
  40. top: 50%;
  41. left: 50%;
  42. transform: translate(-50%, -50%);
  43. text-align: center;
  44. .empty-icon{font-size:3rem;padding:1rem 0;color:#999}
  45. .p {
  46. color: #7c7f88;
  47. font-size:$subFontSize;
  48. padding: 0;
  49. margin: 0;
  50. font-weight: normal;
  51. }
  52. }
  53. .mb-body {font-size:$subFontSize;
  54. .img{width:100% !important}
  55. }
  56. </style>