添加子女信息

pages.json

@@ -365,6 +365,15 @@
             }
             
         }
+        ,{
+            "path" : "pages/parents/mine/addChildInformation",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	"globalStyle": {
 		"navigationStyle": "custom", // 隐藏系统导航栏

pages/parents/mine/addChildInformation.vue

@@ -0,0 +1,181 @@
+<template>
+	<view>
+		<u-navbar title="添加子女信息" >
+
+		</u-navbar>
+		<view class="photo">
+			<img src="../../../assets/img/editPhoto.png" alt="">
+			<view class="edit-photo">
+				<img src="../../../assets/img/md-camera_alt@1x(1).png" alt="">
+			</view>
+		</view>
+		<view class="change">
+			点击更换头像
+		</view>
+		
+		<view class="gender">
+			<view class="man checked">
+				男
+			</view>
+			<view class="woman">
+				女
+			</view>
+			
+		</view>
+		
+		<view class="infos">
+			<view class="name">
+				<input type="text" placeholder="请填写子女姓名">
+				<view class="icon">
+					<img src="../../../assets/img/riLine-user-5-line@1x.png" alt="">
+				</view>
+			</view>
+			
+			<view class="birthday">
+				<input type="text" placeholder="请选择子女生日">
+				<view class="icon">
+					<img src="../../../assets/img/riLine-calendar-line@1x.png" alt="">
+				</view>
+				<view class="icon-right">
+					<u-icon name="arrow-down" color="#0DBAC7" size="36"></u-icon>
+				</view>
+			</view>
+			
+		</view>
+		
+		<button class="submit"> 提交</button>
+		<button class="delete"> 删除</button>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page{
+		background-color: #fff;
+	}
+	
+	.photo{
+		margin: 20px auto 8px;
+		width: 160rpx;
+		height: 160rpx;
+		position: relative;
+		
+		img{
+			width: 100%;
+			height: 100%;
+			border-radius: 999px;
+		}
+		
+	}
+	.edit-photo{
+		width: 56rpx;
+		height: 56rpx;
+		background-color: rgba(78, 141, 246, 1);
+		border: 4rpx solid rgba(255, 255, 255, 1);
+		text-align: center;
+		border-radius: 999px;
+		z-index: 999;
+		position: absolute;
+		right: 0;
+		bottom: 0;
+		
+		img{
+			
+			width: 32rpx;
+			height: 32rpx;
+			margin-top: 8rpx;
+		}
+	}
+   .change{
+	   color: rgba(13, 186, 199, 1);
+	   text-align: center;
+   }
+   .gender{
+	   width: 50%;
+	   margin: 20px auto 40px;
+	   display: flex;
+	   justify-content: space-between;
+	   .man,.woman{
+		   width: 160rpx;
+		   line-height: 64rpx;
+		   border-radius: 100rpx;
+		   background-color: rgba(242, 242, 242, 1);
+		   color: rgba(16, 16, 16, 1);
+		   font-size: 28rpx;
+		   text-align: center;
+	   }
+	   .checked{
+		   background-color: #fff;
+		   color: #43C9D3;
+		   border: 1px solid #43C9D3;
+	   }
+   }
+
+uni-input{
+	
+	width: 74.4%;
+	margin: 0 auto;
+	border: 1px solid rgba(13, 186, 199, 1);
+	border-radius: 50px;
+	height: 88rpx;
+	line-height: 88rpx;
+	
+}
+.name,.birthday{
+	position: relative;
+	margin-bottom: 20px;
+}
+/deep/.uni-input-placeholder{
+	text-indent: 72rpx;
+	color: rgba(204, 204, 204, 1);
+	font-size:32rpx;
+}
+/deep/.uni-input-input{
+	text-indent: 72rpx;
+}
+.icon{
+	position: absolute;
+	top: 26rpx;
+	left: 120rpx;
+	img{
+		width: 40rpx;
+		height: 40rpx;
+	}
+}
+.icon-right{
+	position: absolute;
+	top: 26rpx;
+	right: 120rpx;
+}
+
+
+.submit{
+	margin: 64px 48px 16px 48px;
+	background-color: rgba(13, 186, 199, 1);
+	color: rgba(255, 255, 255, 1);
+	font-size: 16px;
+	line-height: 44px;
+	border-radius: 50px;
+}
+.delete{
+	margin: 0 48px;
+	font-size: 16px;
+	line-height: 44px;
+	border-radius: 50px;
+	background-color: rgba(220, 223, 224, 1);
+	color: rgba(51, 51, 51, 1);
+}
+</style>