View.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. <template>
  2. <view class="container" v-if="isShow">
  3. <view class="contentBox">
  4. <view class="headerBox">
  5. <view class="title">{{NoticeTitle}}</view>
  6. <view class="timecenter">{{NoticeDate}}</view>
  7. </view>
  8. <view class="article" v-if="type==0">
  9. <bctos-rich-text :nodes="NoticeContent"></bctos-rich-text>
  10. </view>
  11. <view class="article" v-else>
  12. <video class="noticeInfoVedio" v-if="NoticeVideoSrc" :src="NoticeVideoSrc"></video>
  13. </view>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. data() {
  20. return {
  21. isShow: false,
  22. id: '',
  23. type: 0,
  24. NoticeTitle: "",
  25. NoticeDate: "",
  26. NoticeContent: '',
  27. NoticeVideoSrc: ''
  28. }
  29. },
  30. onLoad(option) {
  31. this.id = decodeURIComponent(option.id);
  32. this.type = option.type;
  33. this.getData();
  34. },
  35. methods: {
  36. getData() {
  37. let that = this;
  38. that.$admin.req({
  39. method: 'GET',
  40. url: '/api/v1/Snapshot/notification/' + that.id
  41. }).then(res => {
  42. if (res) {
  43. that.NoticeTitle = res.title;
  44. that.NoticeDate = res.creationTime ? that.$util.formatTime(new Date(res.creationTime)) : '';
  45. that.NoticeContent = res.content.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function(match, reSrc) {
  46. var strImg = '<img src="' + reSrc + '" style="width:100%;" />';
  47. return strImg;
  48. });
  49. that.NoticeVideoSrc = res.videoPath ? (that.$admin.config.getfileurl + res.videoPath) : '';
  50. }
  51. that.isShow = true;
  52. }, err => {
  53. that.$util.msg(err);
  54. })
  55. },
  56. onBackTo() {
  57. uni.navigateBack();
  58. }
  59. }
  60. }
  61. </script>
  62. <style lang="less">
  63. .contentBox {
  64. height: calc(100% - 30rpx);
  65. padding: 0 20rpx 30rpx;
  66. overflow-y: auto;
  67. }
  68. .headerBox {
  69. border-bottom: 1px #d2d2d2 solid;
  70. padding: 40rpx 0 20rpx;
  71. }
  72. .title {
  73. font-size: 36rpx;
  74. font-weight: bold;
  75. margin-bottom: 20rpx;
  76. text-align: center;
  77. }
  78. .time{
  79. font-size: 30rpx;
  80. color: #666666;
  81. text-align: right;
  82. }
  83. .timecenter {
  84. font-size: 30rpx;
  85. color: #666666;
  86. text-align: right;
  87. }
  88. .article {
  89. font-size: 28rpx;
  90. background-color: #FFFFFF;
  91. color: #777;
  92. padding: 30rpx 0;
  93. line-height: 2.5;
  94. }
  95. .bottomBox {
  96. padding-bottom: 20rpx;
  97. }
  98. .author {
  99. text-align: right;
  100. }
  101. .noticeInfoVedio {
  102. width: 100%;
  103. height: 500rpx;
  104. }
  105. </style>