Info.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. <template>
  2. <div>
  3. <common @asynCallBack="asynCallBack"></common>
  4. <top-header :pageTitle="pageTitle"></top-header>
  5. <div class="mui-content">
  6. <div class="vongi-notice">
  7. <div class="mui-h3">
  8. {{detail.title}}
  9. <h6 v-text="detail.createTime"></h6>
  10. </div>
  11. <p v-html="detail.content"></p>
  12. </div>
  13. <div v-if="noticeList.length" class="vongi-notice-list">
  14. <h3><img src="~$project/assets/img/text.png" width="12" />相关内容</h3>
  15. <div class="vongi-floor-padded">
  16. <router-link :to="{name:'CommonNoticeInfo',query:{id:item.id}}" v-for="(item,index) in noticeList" class="mui-ellipsis"
  17. v-text="item.title"></router-link>
  18. </div>
  19. </div>
  20. </div>
  21. <loading :visible="isLoading"></loading>
  22. </div>
  23. </template>
  24. <script>
  25. import * as API_Notice from '@/apis/Common/notice'
  26. import Common from '$project/components/Common.vue'
  27. import Loading from '$project/components/Loading.vue'
  28. import TopHeader from '$project/components/TopHeader.vue'
  29. import {
  30. mapGetters,
  31. mapMutations
  32. } from 'vuex'
  33. export default {
  34. name: 'CommonNoticeInfo',
  35. components: {
  36. Common,
  37. Loading,
  38. TopHeader
  39. },
  40. data() {
  41. return {
  42. pageTitle: '消息详情',
  43. isLoading: false,
  44. id: this.$route.query.id,
  45. detail: [],
  46. noticeList: [],
  47. }
  48. },
  49. created() {
  50. },
  51. methods: {
  52. //获取详情
  53. getDetail() {
  54. this.isLoading = true;
  55. API_Notice.getMessageInfo(this.id).then(response => {
  56. this.detail = response;
  57. this.isLoading = false;
  58. //获取最新5条通知消息
  59. this.getLastNotice();
  60. }).catch(error => {
  61. this.isLoading = false;
  62. mui.toast(error);
  63. })
  64. },
  65. //获取最新5条通知消息
  66. getLastNotice() {
  67. this.isLoading = true;
  68. API_Notice.getTopList({
  69. type: this.detail.type,
  70. limit: 5,
  71. excludeMessageId: this.id
  72. }).then(response => {
  73. this.noticeList = response;
  74. this.isLoading = false;
  75. }).catch(error => {
  76. this.isLoading = false;
  77. mui.toast(error);
  78. })
  79. },
  80. asynCallBack() {
  81. },
  82. },
  83. mounted() {
  84. //获取详情
  85. this.getDetail();
  86. },
  87. destroyed() {},
  88. computed: {
  89. ...mapGetters({
  90. openId: 'wx_openid',
  91. token: 'token',
  92. })
  93. }
  94. }
  95. </script>
  96. <style scoped src="$project/assets/css/xpwyfyy.css"></style>
  97. <style scoped>
  98. </style>