messageInfo.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. <template>
  2. <view class="info">
  3. <u-navbar
  4. title-color="#fff"
  5. :custom-back="customBack"
  6. :border-bottom="false"
  7. back-icon-color="#CCE8FF"
  8. :background="{background: 'linear-gradient(99deg, #7A4398 0%, #5A5DB9 100%)' }"
  9. title="消息详情"></u-navbar>
  10. <view class="time">{{details.createTime}}</view>
  11. <view class="box">
  12. <view class="title">{{details.title}}</view>
  13. <view class="content">{{details.content}}</view>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. data() {
  20. return {
  21. details: {}
  22. };
  23. },
  24. onLoad(page) {
  25. const details = JSON.parse(page.details)
  26. if (details) {
  27. this.details = details
  28. }
  29. },
  30. methods: {
  31. customBack() {
  32. this.$u.route({
  33. url: 'pages/message/message'
  34. });
  35. }
  36. }
  37. }
  38. </script>
  39. <style>
  40. /* #ifndef H5 */
  41. page {
  42. height: 100%;
  43. background-color: #F6F6FF;
  44. }
  45. /* #endif */
  46. </style>
  47. <style lang="scss" scoped>
  48. .info {
  49. padding: 40rpx 40rpx;
  50. }
  51. .box {
  52. margin-top: 20rpx;
  53. background-color: white;
  54. border-radius: 15rpx;
  55. .title {
  56. padding-top: 20rpx;
  57. text-align: center;
  58. font-size: 40rpx;
  59. }
  60. }
  61. .content {
  62. text-indent: 2em;
  63. padding: 20rpx 40rpx;
  64. line-height: 44rpx;
  65. }
  66. </style>