detail.vue 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <template>
  2. <view>
  3. <!--文章标题-->
  4. <view class="title" >{{dataDetail.title}}</view>
  5. <view class="flex text-gray" style="padding: 0 0 30rpx 30rpx;">
  6. <view >
  7. <text class="cuIcon-time padding-right-10"></text>
  8. <text style="font-size: 28rpx;color: #999999;text-align: left;">{{dataDetail.createTime}}</text>
  9. </view>
  10. <view class="margin-left-30">
  11. <text class="cuIcon-attention padding-right-10"></text>
  12. <text style="font-size: 28rpx;color: #999999;text-align: left;">{{dataDetail.reader}}</text>
  13. </view>
  14. </view>
  15. <view class="content-view-box">
  16. <view class="font-view">
  17. <rich-text :nodes="dataDetail.article"></rich-text>
  18. </view>
  19. </view>
  20. <u-divider height="80">到底了</u-divider>
  21. </view>
  22. </template>
  23. <script>
  24. var app=getApp()
  25. export default {
  26. components: {
  27. },
  28. data() {
  29. return {
  30. id:'',
  31. dataDetail:{}
  32. }
  33. },
  34. onShow() {
  35. },
  36. onLoad(options) {
  37. this.id=options.id || ''
  38. this.read()
  39. this.fetchDataDetail()
  40. },
  41. methods: {
  42. fetchDataDetail(){
  43. this.$api.CMS.detail({id:this.id}).then(res=>{
  44. this.dataDetail=res.data
  45. })
  46. },
  47. async read(){
  48. let params={
  49. id:this.id,
  50. addCount:1
  51. }
  52. await this.$api.CMS.addReaderCount(params)
  53. }
  54. }
  55. }
  56. </script>
  57. <style lang="scss">
  58. page {
  59. background: #FFFFFF;
  60. }
  61. .title {
  62. font-weight: 800;
  63. font-size: 40rpx;
  64. line-height: 54rpx;
  65. color: #333333;
  66. margin: 35rpx;
  67. }
  68. .content-view-box {
  69. font-weight: normal;
  70. vertical-align: baseline;
  71. .font-view {
  72. padding: 27.27rpx;
  73. line-height: 2;
  74. }
  75. image {
  76. width: 100%;
  77. }
  78. }
  79. </style>