activityDetail.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <template>
  2. <view>
  3. <u-navbar title="活动详情"></u-navbar>
  4. <view class="main" v-html="info.content">
  5. </view>
  6. <view class="bottom" @click="gotoUrl('pages/mine/issue')" >
  7. <button>发布作品</button>
  8. </view>
  9. </view>
  10. </template>
  11. <script>
  12. import * as API from '@/apis/pagejs/activity.js'
  13. export default {
  14. data() {
  15. return {
  16. id:'',
  17. info:{},
  18. }
  19. },
  20. onLoad(op){
  21. if(op.id){
  22. this.id=op.id
  23. this.getInfo()
  24. }
  25. },
  26. methods: {
  27. getInfo(){
  28. uni.showLoading({
  29. title: "加载中",
  30. mask: true,
  31. })
  32. API.edit(this.id).then((res) => {
  33. uni.hideLoading();
  34. //this.list=response.data.data
  35. this.info=res.data;
  36. }).catch(error => {
  37. uni.showToast({
  38. title: error,
  39. icon: "none"
  40. })
  41. })
  42. },
  43. }
  44. }
  45. </script>
  46. <style lang="scss" scoped>
  47. page{
  48. padding-bottom: 100px;
  49. }
  50. .main{
  51. margin: 24rpx 32rpx 0 32rpx;
  52. // 活动介绍
  53. .introduction{
  54. margin-top: 24rpx;
  55. .title{
  56. color: rgba(16, 16, 16, 1);
  57. font-size: 18px;
  58. line-height: 26px;
  59. }
  60. .content{
  61. color: rgba(51, 51, 51, 1);
  62. line-height: 24px;
  63. margin-top: 16rpx;
  64. }
  65. }
  66. // 活动时间
  67. .date{
  68. margin-top: 32rpx;
  69. .title{
  70. color: rgba(16, 16, 16, 1);
  71. font-size: 18px;
  72. line-height: 26px;
  73. }
  74. .item{
  75. margin-top:16rpx;
  76. display: flex;
  77. color: rgba(51, 51, 51, 1);
  78. line-height: 20px;
  79. .item-title{
  80. margin-right: 24rpx;
  81. }
  82. .name{
  83. width: 100rpx;
  84. }
  85. }
  86. }
  87. }
  88. // 积分获取
  89. .integral{
  90. margin-top: 32rpx;
  91. .title{
  92. color: rgba(16, 16, 16, 1);
  93. font-size: 18px;
  94. line-height: 26px;
  95. }
  96. .integral-group{
  97. margin-top: 24rpx;
  98. background-color: #fff;
  99. .item{
  100. display: flex;
  101. justify-content: space-between;
  102. line-height: 44px;
  103. padding-left: 16rpx;
  104. color: rgba(51, 51, 51, 1);
  105. font-size: 16px;
  106. border-bottom: solid 1px #e6e6e6;
  107. font-size: 14rpx;
  108. .value{
  109. width: 170rpx;
  110. text-align: center;
  111. }
  112. }
  113. .item1{
  114. color: rgba(16, 16, 16, 1);
  115. font-size: 16px;
  116. }
  117. }
  118. }
  119. .bottom{
  120. padding: 16rpx 32rpx;
  121. background-color: #fff;
  122. position: fixed;
  123. bottom: 0;
  124. left: 0;
  125. right: 0;
  126. uni-button{
  127. border-radius: 8px;
  128. background-color: rgba(31, 74, 153, 1);
  129. color: rgba(255, 255, 255, 1);
  130. font-size: 16px;
  131. line-height: 40px;
  132. }
  133. }
  134. </style>