noticeList.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <template>
  2. <view>
  3. <view class="align-items" style="margin-top: 80rpx;">
  4. <back></back>
  5. <view class="title-text" style="margin-left: 20rpx;">
  6. 公告列表
  7. </view>
  8. </view>
  9. <view class="notice" v-for="(item,index) in list" :key="index" >
  10. <view>
  11. <view class="justify-content">
  12. <view class="font-forty">
  13. {{item.title}}
  14. </view>
  15. <view class="font-twenty-eight gray">
  16. {{item.time}}
  17. </view>
  18. </view>
  19. <view class="font-thirty-two black" style="margin: 30rpx 0;">
  20. <rich-text :nodes="item.text"></rich-text>
  21. </view>
  22. </view>
  23. </view>
  24. </view>
  25. </template>
  26. <script>
  27. import service from '@/api/index.js'
  28. export default {
  29. data() {
  30. return {
  31. list: []
  32. }
  33. },
  34. onLoad() {
  35. this.lists()
  36. },
  37. methods: {
  38. toDetail(url){
  39. console.log(url)
  40. uni.navigateTo({
  41. url
  42. })
  43. },
  44. lists(){
  45. service.getNoticeList().then(res=>{
  46. // console.log('getNoticeList',res)
  47. this.list = res
  48. })
  49. }
  50. }
  51. }
  52. </script>
  53. <style lang="scss" scoped>
  54. .notice {
  55. margin: 20rpx;
  56. padding: 20rpx;
  57. background: #FFFFFF;
  58. box-shadow: 0rpx 8rpx 17rpx 0rpx rgba(0, 0, 0, 0.04);
  59. border-radius: 10rpx;
  60. }
  61. .text {
  62. border-left: 15rpx solid #3857F3;
  63. padding-left: 20rpx;
  64. }
  65. </style>