detail.vue 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <template>
  2. <div class="detailBody">
  3. <div class="detailBox">
  4. <div class="detailTitle">XXXXX南门出口道闸维修的通知</div>
  5. <div class="detailTime">2024-04-25 09:00</div>
  6. <div class="noticeTitle">这是通知内容</div>
  7. <!-- 这里用v-html-->
  8. <div class="noticeInfo">这是通知内容,这是通知内容,这是通知内容,这是通知内容,这是通知内容,这是通知内容这是通知内容,这是通知内容,这是通知内容,这是通知内容</div>
  9. <div class="file">
  10. 附件:
  11. <span style="color: rgba(3, 101, 249, 1)">POOD.pdf</span>
  12. </div>
  13. </div>
  14. </div>
  15. </template>
  16. <script>
  17. export default {
  18. name: "detail",
  19. data(){
  20. return{
  21. }
  22. },
  23. onLoad({type}){
  24. console.log(JSON.parse(type))
  25. }
  26. }
  27. </script>
  28. <style lang="scss">
  29. .detailBody{
  30. .detailBox{
  31. margin-top: 24rpx;
  32. background: white;
  33. width: 100%;
  34. height: 1424rpx;
  35. padding: 32rpx;
  36. box-sizing: border-box;
  37. .detailTitle{
  38. font-size: 32rpx;
  39. color: rgba(34, 34, 34, 1);
  40. }
  41. .detailTime{
  42. font-size: 28rpx;
  43. color: rgba(136, 136, 136, 1);
  44. padding: 16rpx 0 24rpx 0;
  45. border-bottom: 1px solid rgba(230, 230, 230, 1);
  46. }
  47. .noticeTitle{
  48. color: rgba(51, 51, 51, 1);
  49. font-size: 28rpx;
  50. padding: 28rpx 0;
  51. }
  52. .noticeInfo{
  53. line-height: 38rpx;
  54. color: rgba(51, 51, 51, 1);
  55. font-size: 28rpx;
  56. }
  57. .file{
  58. padding: 32rpx 0;
  59. font-size: 28rpx;
  60. color: rgba(51, 51, 51, 1);
  61. }
  62. }
  63. }
  64. </style>