guidedetail.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <template>
  2. <view class="sub" :style="'padding-top:'+padtop+'px'">
  3. <navbar :back="false" :title="title" :bgcolor="backgroundColor" color="#fff" fixed zIndex="1010" :center="true" :custom='true' @getTop="getTop" back="true"/>
  4. <!-- 头部 使用指南-->
  5. <view class="gpd" v-if="type=='use'">
  6. <view class="guidtit" v-if="usedetail.useTitle">
  7. {{usedetail.useTitle}}
  8. </view>
  9. <view class="guidtime" v-if="usedetail.createTime">{{usedetail.createTime}}</view>
  10. <rich-text v-if="useContent" :nodes="useContent"></rich-text>
  11. </view>
  12. <!-- 正常福利 -->
  13. <view class="gpd" v-else>
  14. <view class="guidtit" v-if="detail.welfareTitle">
  15. {{detail.welfareTitle}}
  16. </view>
  17. <view class="guidtime" v-if="detail.createTime">{{detail.createTime}}</view>
  18. <rich-text v-if="welfareContent" :nodes="welfareContent"></rich-text>
  19. </view>
  20. </view>
  21. </template>
  22. <script>
  23. import url from "@/util/url";
  24. let {imgDomain} = url
  25. export default{
  26. data(){
  27. return{
  28. padtop:this.$http._GET.customBarH||0,
  29. backgroundColor: 'linear-gradient(90deg, #A00517, #E93030)',
  30. string:'',
  31. title:'使用指南',
  32. usedetail:{},
  33. detail:{},
  34. type:'use',
  35. useContent:'',
  36. welfareContent:'',
  37. }
  38. },
  39. onLoad(e) {
  40. this.type=e.type
  41. if(e.type=='use'){
  42. this.title='使用指南'
  43. this.getDatauseFn()
  44. }else{
  45. this.title='优惠福利'
  46. this.getDataFn()
  47. }
  48. },
  49. methods:{
  50. getTop(e){
  51. this.padtop=e
  52. },
  53. getDatauseFn(){
  54. var that=this;
  55. that.$http.get("system/use/new").then(res => {
  56. if (res.code == 200) {
  57. // /profile/upload/2022/07/14/微信截图_20220711151232_20220714145922A003.png
  58. if(res.data.useContent){
  59. var t='<img style="max-width: 100%;" src="'+imgDomain;
  60. var newhtml=res.data.useContent.replace(/\<img src="/gi, t);
  61. that.useContent=newhtml;
  62. }
  63. that.usedetail=res.data
  64. } else {
  65. uni.showToast({
  66. title: res.msg,
  67. duration: 1000,
  68. icon: 'none'
  69. });
  70. }
  71. })
  72. },
  73. getDataFn(){
  74. var that=this;
  75. that.$http.get("system/welfare/new").then(res => {
  76. if (res.code == 200) {
  77. if(res.data.welfareContent){
  78. var t='<img style="max-width: 100%;" src="'+imgDomain;
  79. var newhtml=res.data.welfareContent.replace(/\<img src="/gi, t);
  80. that.welfareContent=newhtml;
  81. }
  82. that.detail=res.data
  83. } else {
  84. uni.showToast({
  85. title: res.msg,
  86. duration: 1000,
  87. icon: 'none'
  88. });
  89. }
  90. })
  91. },
  92. }
  93. }
  94. </script>
  95. <style scoped lang="scss">
  96. .sub{box-sizing: border-box;width: 100%;min-height: 100vh;}
  97. .gpd{padding:30rpx 26rpx;}
  98. .guidtit{font-size: 30rpx;font-weight: bold;color: #222222;margin-bottom: 32rpx;}
  99. .guidtime{font-size: 20rpx;color: #676767;margin-bottom: 60rpx;}
  100. </style>