feat：分组页面

pages.json

@@ -122,6 +122,14 @@
 				"navigationStyle": "custom",
 				"enablePullDownRefresh" : false
 			}
+		},
+		{
+			"path" : "pages/addGroup/addGroup",
+			"style" :
+			{
+				"navigationStyle": "custom",
+				"enablePullDownRefresh" : false
+			}
 		}
 	],
 	"tabBar": {

pages/addGroup/addGroup.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="page">
+		<uni-nav-bar :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true" left-icon="left"
+			title="新增分组" @clickLeft="back" />
+		<view>
+
+				<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm">
+
+					<u-form-item prop="groupName" borderBottom>
+						<view class="item">
+							<text class="key">分组名称</text>
+							<view class="flex-row input">
+								<u--input v-model="form.groupName" placeholder="请输入分组名称" border="none"></u--input>
+							</view>
+						</view>
+					</u-form-item>
+
+					<u-form-item prop="userInfo.sex" borderBottom>
+						<view class="item">
+							<text class="key">负责人</text>
+							<view class="flex-row input">
+								<u--input disabled placeholder="请选择负责人" border="none"></u--input>
+								<u-icon name="arrow-right"></u-icon>
+							</view>
+						</view>
+					</u-form-item>
+
+					<u-form-item prop="userInfo.sex" borderBottom>
+						<view class="item">
+							<text class="key">分组成员</text>
+							<view class="flex-row input">
+								<u--input disabled placeholder="请选择分组成员" border="none"></u--input>
+								<u-icon name="arrow-right"></u-icon>
+							</view>
+						</view>
+					</u-form-item>
+
+				</u--form>
+
+				<view class="members">
+					<view class="membersTitle ">
+						<text>已选择的分组成员</text>
+					</view>
+					<scroll-view scroll-y class="scroll-y" >
+					<view class="flex-row justify-between member" v-for="item in 10">
+						<view class="flex-row">
+							<u-icon name="account-fill" size="24"></u-icon>
+							<text class="name">张三</text>
+						</view>
+						<view>
+							<u-icon name="trash" size="24"></u-icon>
+						</view>
+					</view>
+					</scroll-view>
+
+				</view>
+
+		</view>
+		<view class="addGroup">
+			<text>提交</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				height: '',
+				form:{
+					groupName:''
+				},
+				rules: {
+					'groupName': {
+						type: 'string',
+						required: true,
+						min:1,
+						message: '请输入分组名称',
+						trigger: ['blur', 'change']
+					}
+				},
+			}
+		},
+		onLoad(e) {
+			let sysInfo = uni.getSystemInfoSync()
+			this.height = sysInfo.windowHeight - 120 + 'px' //除标题栏栏外的屏幕可用高度
+		},
+		methods: {
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import './index.rpx.css';
+</style>

pages/addGroup/index.rpx.css

@@ -0,0 +1,59 @@
+.page {
+	background: #F7F7F7;
+	padding: 0 32rpx;
+	height: 100vh;
+}
+.addGroup{
+	width: 686rpx;
+	height: 84rpx;
+	background: #FFE05C;
+	border-radius: 54rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #333333;
+	line-height: 84rpx;
+	text-align: center;
+	margin-top: 24rpx;
+}
+.item{
+	width: 686rpx;
+}
+.key{
+	height: 44rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #333333;
+	line-height: 44rpx;
+}
+.input{
+	margin-top: 16rpx;
+}
+.scroll-y{
+	height: 488rpx;
+}
+.members{
+	background: #FAFAFA;
+	border-radius: 16rpx;
+	margin-top: 32rpx;
+	padding: 24rpx;
+}
+.member{
+	padding: 32rpx;
+	border-top: 2rpx solid #EEEEEE;
+}
+.member:first-child{
+	border-top: 2rpx solid #FAFAFA;
+}
+.membersTitle{
+	font-size: 28rpx;
+	font-weight: bold;
+	color: #333333;
+}
+.name{
+	height: 40rpx;
+	font-size: 28rpx;
+	font-weight: 400;
+	color: #333333;
+	line-height: 40rpx;
+	margin-left: 20rpx;
+}

pages/myGroup/myGroup.vue

@@ -21,7 +21,7 @@
 				</view>
 			</scroll-view>
 		</view>
-		<view class="addGroup">
+		<view class="addGroup" @click="goAddGroup">
 			<text>新增分组</text>
 		</view>
 	</view>
@@ -46,6 +46,11 @@
 					delta: 1
 				})
 			},
+			goAddGroup(){
+				uni.navigateTo({
+					url:'/pages/addGroup/addGroup'
+				})
+			}
 		}
 	}
 </script>