onedetail.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. <template>
  2. <view style="padding: 20upx 32upx;">
  3. <view style="font-size: 35rpx;padding-bottom: 46upx;">{{aricte.article_title}}</view>
  4. <view style="color: #999;padding-bottom: 46upx;">{{aricte.article_time}}</view>
  5. <rich-text :nodes="nodes"></rich-text>
  6. <view v-if="aricte.ad_type!=0 && nodes!='' " class="aricte" :class="isclose?'closeacrile':''">
  7. <view style="display: flex;justify-content: space-between;padding: 20upx 0;">
  8. <view>{{aricte.ad_title}}</view>
  9. <view style="color:#4399FC;" @click="close">x关闭</view>
  10. </view>
  11. <view @click="godetail" style="padding: 10upx 0upx;position: relative;">
  12. <image :src=" pictureUrl + '/' + aricte.ad_image" style="width: 100%;" mode="widthFix"/>
  13. <view style="color: #fff;position: absolute;bottom: 20upx;left: 20upx;">广告</view>
  14. </view>
  15. </view>
  16. </view>
  17. </template>
  18. <script>
  19. export default {
  20. data() {
  21. return {
  22. isclose: false,
  23. pictureUrl: this.pictureUrl,
  24. article_id: '',
  25. nodes:'',
  26. article_thumb:'',
  27. aricte: {}
  28. }
  29. },
  30. onLoad(a) {
  31. this.article_id = a.id;
  32. this.article_thumb = a.article_thumb;
  33. let name = a.name;
  34. uni.setNavigationBarTitle({
  35. title: name
  36. });
  37. this.getactrile();
  38. },
  39. methods: {
  40. godetail() {
  41. if(this.aricte.ad_type == 1) {
  42. let id = this.aricte.goods_id; // 商品Id
  43. let store_id = this.aricte.store_id; // 商品Id
  44. uni.navigateTo({
  45. url:`/pages/index/shop?id=${id}&store_id=${store_id}`
  46. })
  47. }else if(this.aricte.ad_type == 2) {
  48. //商品
  49. let id = this.aricte.store_id; // 商品Id
  50. uni.navigateTo({
  51. url: `/pages/index/hotel?id=${id}`
  52. });
  53. }
  54. },
  55. close() {
  56. this.isclose = true;
  57. },
  58. getactrile() {
  59. this.request({
  60. url: '/v1/entry/news_desc',
  61. method: 'post',
  62. data: {
  63. article_id: this.article_id
  64. },
  65. success: (res) => {
  66. let { data } = res.data;
  67. this.aricte = data;
  68. const regex = new RegExp('<img', 'gi');
  69. data.article_content =data.article_content.replace(regex,`<img class="changeimg"`);
  70. console.log(data.article_content);
  71. this.nodes = data.article_content; // 富文本渲染
  72. }
  73. })
  74. }
  75. },
  76. }
  77. </script>
  78. <style>
  79. .aricte {
  80. background-color: #EEEEEE;
  81. padding: 0 33upx 10upx 33upx;
  82. }
  83. .closeacrile {
  84. display: none;
  85. }
  86. .changeimg {
  87. max-width: 100% !important;
  88. width: 100%;
  89. height: auto!important;
  90. padding: 8upx 0;
  91. display: block;
  92. text-align: center;
  93. }
  94. </style>