86 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			Vue
		
	
	
	
		
		
			
		
	
	
			86 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			Vue
		
	
	
	
|  | <template> | ||
|  |   <view class="content"> | ||
|  |     <view class="topimg"> | ||
|  |       <img :src="detailData.actCover " | ||
|  |            alt="" /> | ||
|  |     </view> | ||
|  |     <view class="contentbox"> | ||
|  |       <view class="title"> | ||
|  |         活动介绍 | ||
|  |       </view> | ||
|  |       <view class="contenttext" | ||
|  |             v-html="detailData.actExplain"> | ||
|  |       </view> | ||
|  |     </view> | ||
|  |   </view> | ||
|  | </template> | ||
|  | 
 | ||
|  | <script> | ||
|  | import * as act from '@/config/activity.js' | ||
|  | export default { | ||
|  |   data() { | ||
|  |     return { | ||
|  |       pkId: '', | ||
|  |       detailData: {}, | ||
|  |     } | ||
|  |   }, | ||
|  |   onLoad(query) { | ||
|  |     this.pkId = query.pkId | ||
|  |     console.log('🌈query', query.pkId) | ||
|  |     this.getDetail() | ||
|  |   }, | ||
|  |   methods: { | ||
|  |     getDetail() { | ||
|  |       act | ||
|  |         .getActivityDetailList({ | ||
|  |           pkId: this.pkId, | ||
|  |         }) | ||
|  |         .then((res) => { | ||
|  |           this.detailData = res.rows[0] | ||
|  |           const regex = new RegExp('<img', 'gi') | ||
|  |           this.detailData.actExplain = this.detailData.actExplain.replace( | ||
|  |             regex, | ||
|  |             `<img style="max-width: 200px;"` | ||
|  |           ) | ||
|  |         }) | ||
|  |     }, | ||
|  |   }, | ||
|  | } | ||
|  | </script> | ||
|  | 
 | ||
|  | <style lang="scss" scoped> | ||
|  | .content { | ||
|  |   height: 100vh; | ||
|  |   background: #a60c02; | ||
|  |   // background: linear-gradient(180deg, #6289C9 0%, #125AB3 100%);
 | ||
|  | 
 | ||
|  |   .topimg { | ||
|  |     width: 100%; | ||
|  |     height: auto; | ||
|  | 
 | ||
|  |     img { | ||
|  |       width: 100%; | ||
|  |       height: 100%; | ||
|  |     } | ||
|  |   } | ||
|  | 
 | ||
|  |   .contentbox { | ||
|  |     text-align: center; | ||
|  |     padding: 28rpx 42rpx; | ||
|  | 
 | ||
|  |     .title { | ||
|  |       font-size: 40rpx; | ||
|  |       font-weight: 400; | ||
|  |       color: #fbf0cf; | ||
|  |     } | ||
|  | 
 | ||
|  |     .contenttext { | ||
|  |       font-size: 24rpx; | ||
|  |       font-weight: 400; | ||
|  |       color: #fbf0cf; | ||
|  |       line-height: 28rpx; | ||
|  |       margin-top: 44rpx; | ||
|  |     } | ||
|  |   } | ||
|  | } | ||
|  | </style> |