t-i-notice.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. <template>
  2. <view class="content">
  3. <view class="box">
  4. <!-- 文字滚动 -->
  5. <uni-notice-bar :speed="50" background-color="#ffffff00" color="#fff" single="true"
  6. :text="text_time"></uni-notice-bar>
  7. <!-- 文字滚动 -->
  8. <uni-notice-bar scrollable="true" :speed="20" background-color="#ffffff00" color="#fff" single="true"
  9. :text="text"></uni-notice-bar>
  10. </view>
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. name: "t-i-notice",
  16. props: [
  17. "base_url"
  18. ],
  19. data() {
  20. return {
  21. text_time:"",
  22. text: "暂无公告。"
  23. };
  24. },
  25. created() {
  26. this.get_notice()
  27. this.getCurrentDate()
  28. },
  29. methods: {
  30. get_notice() {
  31. uni.request({
  32. url: this.base_url + "/notice/list",
  33. method: "GET",
  34. success: (res) => {
  35. console.log(res)
  36. if(!res.data.data.content){
  37. this.text = res.data.data.message
  38. }else{
  39. this.text = res.data.data.title + res.data.data.content
  40. }
  41. }
  42. })
  43. },
  44. getCurrentDate() {
  45. var myDate = new Date();
  46. var year = myDate.getFullYear(); //年
  47. var month = myDate.getMonth() + 1; //月
  48. var day = myDate.getDate(); //日
  49. var days = myDate.getDay();
  50. switch (days) {
  51. case 1:
  52. days = '星期一';
  53. break;
  54. case 2:
  55. days = '星期二';
  56. break;
  57. case 3:
  58. days = '星期三';
  59. break;
  60. case 4:
  61. days = '星期四';
  62. break;
  63. case 5:
  64. days = '星期五';
  65. break;
  66. case 6:
  67. days = '星期六';
  68. break;
  69. case 0:
  70. days = '星期日';
  71. break;
  72. }
  73. var str = "今日 " + " " + year + "年" + month + "月" + day + "日  " + days;
  74. this.text_time = str
  75. }
  76. }
  77. }
  78. </script>
  79. <style lang="scss">
  80. .content {
  81. width: 750rpx;
  82. height: 244rpx;
  83. background-image: url(./icon/bg_img.jpg);
  84. background-size: 750rpx 334rpx;
  85. background-repeat: no-repeat;
  86. background-position: bottom;
  87. box-sizing: border-box;
  88. padding-top: 20rpx;
  89. }
  90. .box {
  91. margin: 0 auto;
  92. width: 700rpx;
  93. height: 200rpx;
  94. background-color: rgba(255, 255, 255, .4);
  95. border-radius: 20rpx;
  96. box-sizing: border-box;
  97. padding: 20rpx;
  98. /deep/.uni-noticebar {
  99. margin-bottom: 0;
  100. }
  101. }
  102. </style>