活动详情

pages.json

@@ -99,6 +99,15 @@
 			}
 		}
 		
+        ,{
+            "path" : "pages/news/activityDetails",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	"subPackages":[
 		{

pages/news/activityDetails.vue

@@ -0,0 +1,120 @@
+<template>
+	<view>
+		<u-navbar  title="荆州工会鹊桥露营主题中秋相亲会"></u-navbar>
+		<view class="img">
+			<img src="../../static/img/activity.png" alt="">
+		</view>
+		<view class="details">
+			<view class="detail-item">
+				<view class="title">
+					活动名称:
+				</view>
+				<view class="content">
+                荆州工会鹊桥露营主题中秋相亲会
+				</view>
+			</view>
+			<view class="detail-item">
+				<view class="title">
+					活动地址:
+				</view>
+				<view class="content">
+			    荆州市沿江路临江仙公园
+				</view>
+			</view>
+			<view class="detail-item">
+				<view class="title">
+					报名时间:
+				</view>
+				<view class="content">
+			    2022-09-08 18:00截止
+				</view>
+			</view>
+			<view class="detail-item">
+				<view class="title">
+					活动时间:
+				</view>
+				<view class="content">
+               2022-09-10 16:00-21:00
+				</view>
+			</view>
+			<view class="detail-item">
+				<view class="title">
+					活动介绍
+				</view>
+				<view class="content">
+			   
+				</view>
+			</view>
+			<view class="detail-item">
+				<view class="title">
+					特别说明
+				</view>
+				<view class="content">
+			   
+				</view>
+			</view>
+			
+		</view>
+		
+		<u-button>立即报名</u-button>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	/deep/.u-line-1{
+		overflow: inherit;
+	}
+    .img{
+		margin: 32rpx;
+		height: 404rpx;
+		img{
+			width: 100%;
+			height: 100%;
+		}
+	}
+	
+	.details{
+		margin: 32rpx;
+		font-size: 16px;
+		color: #333333;
+		.detail-item{
+			display: flex;
+			margin-bottom: 24rpx;
+			.title{
+				// width: 26%;
+			}
+			.content{
+				flex: 1;
+				margin-left: 24rpx;
+			}
+		}
+	}
+	.u-btn{
+		width: 74.4%;
+		line-height: 44px;
+		border-radius: 50px;
+		background-color: #FF5E5E;
+		font-size: 16px;
+		color: #ffffff;
+		position: fixed;
+		bottom: 8px;
+		left: 0;
+		right: 0;
+	}
+	/deep/.u-hairline-border:after{
+		border: none;
+	}
+</style>