From 47d4935166fdd8cac158c4b054ecd312a63b2270 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 26 Aug 2021 17:32:55 +0800
Subject: [PATCH] 智慧保安app相关调整

---
 pages/groupChat/newGroup/newGroup.vue |  223 ++++++++++++++++++++++++++++++-------------------------
 1 files changed, 121 insertions(+), 102 deletions(-)

diff --git a/pages/groupChat/newGroup/newGroup.vue b/pages/groupChat/newGroup/newGroup.vue
index fbdc103..c104a85 100644
--- a/pages/groupChat/newGroup/newGroup.vue
+++ b/pages/groupChat/newGroup/newGroup.vue
@@ -1,21 +1,41 @@
 <template>
 	<view class="registerUser">
-		<u-form :model="form" ref="uForm">
-			<u-form-item :label="item.title" :prop="item.froms" label-width="200" :left-icon="item.img"
-				:required="item.requireds" v-for="(item, index) in list" :key="index">
-				<u-input v-model="form[item.froms]" :placeholder="item.placeholder" />
-			</u-form-item>
-			<u-form-item label="群成员" prop="role" left-icon="man-add" label-width="200" :required="true">
-				<u-checkbox-group @change="checkboxGroupChange">
+
+		<view class="group-chat-box">
+
+			<u-form :model="form" ref="uForm">
+
+				<u-checkbox-group @change="checkboxGroupChange" :wrap='true' :size="40">
+
 					<u-checkbox v-model="item.checked" v-for="(item, index) in friend" :key="index"
-						:name="item.friendid">
-						{{item.realName}}
+						:name="item.friendid" shape="circle"
+						style="padding: 16rpx 0; height: 92rpx; position: relative; box-sizing: border-box;">
+
+						<view class="head-wrap">
+							<image
+								:src="item.avatar == '' ? 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20191109%2F1d3d4d82715444c4b8284f65e3feed10.jpeg&refer=http%3A%2F%2F5b0988e595225.cdn.sohucs.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1632484198&t=1f4086a5894cbf83b311fa37c276405c' : item.avatar" />
+						</view>
+
+						<view style="margin-left: 106rpx">
+							{{item.realName}}
+						</view>
+
 					</u-checkbox>
 				</u-checkbox-group>
-			</u-form-item>
-		</u-form>
-		<u-button class="submit" @click="submit">
-			创建</u-button>
+
+			</u-form>
+
+		</view>
+
+
+		<view class="establish-box">
+
+			<u-button class="submit" type='primary' @click="submit">
+				立即创建
+			</u-button>
+
+		</view>
+
 	</view>
 </template>
 
@@ -25,53 +45,11 @@
 		data() {
 			return {
 				friend: [],
-				list: [{
-						title: '群名称',
-						img: 'chat',
-						froms: 'groupname',
-						requireds: true,
-						placeholder: '请输入群名称'
-					},
-					{
-						title: '群介绍',
-						img: 'order',
-						froms: 'groupcontent',
-						requireds: true,
-						placeholder: '请输入群介绍'
-					},
-					{
-						title: '群公告',
-						img: 'bell',
-						froms: 'groupnotice',
-						requireds: true,
-						placeholder: '请输入群公告'
-					},
-				],
 				form: {
 					groupname: '',
 					groupcontent: '',
 					groupnotice: '',
 					groupmember: '',
-				},
-				rules: {
-					groupname: [{
-						required: true,
-						message: '请输入群名称',
-						// 可以单个或者同时写两个触发验证方式 
-						trigger: ['change', 'blur'],
-					}],
-					groupcontent: [{
-						required: true,
-						message: '请输入群介绍',
-						// 可以单个或者同时写两个触发验证方式 
-						trigger: ['change', 'blur'],
-					}],
-					groupnotice: [{
-						required: true,
-						message: '请输入群公告',
-						// 可以单个或者同时写两个触发验证方式 
-						trigger: ['change', 'blur'],
-					}]
 				},
 			}
 		},
@@ -84,34 +62,30 @@
 		methods: {
 			submit() {
 				var that = this;
-				this.$refs.uForm.validate(valid => {
-					if (valid) {
-						var d = that.form;
-						if (d.groupmember == "") {
-							uni.showToast({
-								title: '请至少选择一个群成员',
-								icon: "none",
-								duration: 1000
-							});
-							return;
-						}
-						d.time = that.currTime();
-						d.groupid = WxStorage.get("ids");
-						uni.request({
-							url: that.$store.state.piAPI + "/chatgroup/submit",
-							method: "POST",
-							data: d,
-							success: (res) => {
-								uni.showToast({
-									title: '创建成功',
-									icon: "none",
-									duration: 1000
-								});
+				var d = that.form;
+				if (d.groupmember == "") {
+					uni.showToast({
+						title: '请至少选择一个群成员',
+						icon: "none",
+						duration: 1000
+					});
+					return;
+				}
+				d.time = that.currTime();
+				d.groupid = WxStorage.get("ids");
+				uni.request({
+					url: that.$store.state.piAPI + "/chatgroup/submit",
+					method: "POST",
+					data: d,
+					success: (res) => {
+						uni.showToast({
+							title: '创建成功',
+							icon: "none",
+							duration: 1000
+						});
 
-								uni.switchTab({
-									url: '/pages/groupChat/groupChat?'
-								});
-							}
+						uni.switchTab({
+							url: '/pages/groupChat/groupChat?'
 						});
 					}
 				});
@@ -144,7 +118,19 @@
 					},
 					success: (res) => {
 						var resdata = res.data.data.records;
+
 						that.friend = resdata;
+
+						var str = '';
+						resdata.forEach((item, index) => {
+
+							if (index > 2) return;
+
+							str += item.realName + '、';
+
+						})
+
+						this.form.groupname = (str.substr(0, str.length - 1) + '···')
 					}
 				})
 			}
@@ -152,7 +138,9 @@
 	}
 </script>
 
-<style>
+<style lang="scss">
+	@import '../../../common/style/common.scss';
+	
 	.warp {
 		display: flex;
 		align-items: center;
@@ -167,34 +155,65 @@
 	}
 
 	.submit {
-		margin: 30rpx 50rpx 50rpx;
 		border: none;
-		width: 572rpx;
+		width: 94%;
 		height: 86rpx;
 		line-height: 86rpx;
 		box-sizing: border-box;
 		border-radius: 15rpx;
-		background-color: #14b9c8;
 		color: #ffffff;
+		font-size: 38rpx;
 
-		&::after {
-			content: none;
-		}
-
-		&::before {
-			content: none;
-		}
-
-		&[disabled='true'] {
-			background: #e4e4e4;
-			font-size: 36rpx;
-			font-family: Source Han Sans CN;
-			font-weight: 500;
-			color: #ffffff;
-		}
 	}
 
 	.registerUser {
-		padding: 0 1.2rem;
+		height: 100%;
+		background: #f7f7f7;
+
+		.group-chat-box {
+			height: calc(100% - 116rpx);
+			padding: 0 1.2rem;
+			box-sizing: border-box;
+			overflow-y: auto;
+		}
+
+		.establish-box {
+			position: relative;
+			height: 116rpx;
+			background: #fff;
+			text-align: center;
+
+			uni-button {
+				margin: 0;
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+				margin: auto;
+			}
+
+		}
+	}
+
+	.head-wrap {
+		position: absolute;
+		top: 0;
+		left: 66rpx;
+		bottom: 0;
+		right: auto;
+		margin: auto;
+		width: 66rpx;
+		height: 66rpx;
+		border-radius: 50%;
+		background: #e7e7e7;
+
+		uni-image {
+			width: 66rpx;
+			height: 66rpx;
+			border-radius: 50%;
+
+			vertical-align: middle;
+		}
 	}
 </style>

--
Gitblit v1.9.3