<style>
	page{background: #ffffff;}
	.m-app{width:100vw}
	button.sub-btn{width:100%;height:40px;line-height: 40px; background:#2fbec0;border-radius:20px;font-size:15px;font-weight:500;color:#ffffff;margin-top: 30px;}
    .form-body{width:calc(100% - 24px);background: #ffffff;padding: 0px 12px;}
	.form-title{width:100%;text-align: left;font-size: 14px;color:#333333;height:38px;line-height: 38px;}
	.form-content{width:100%;border-bottom: 1px solid #f0f0f0;padding-bottom: 10px;}
	.form-content image{width: 40px;height: 40px;}
	input.form-input{height:38px;width:calc(100% - 50px);margin-left:8px;text-align: left;color:#333333;font-size: 14px;}
	.form-msg{font-size: 12px;text-align: left;width:100%;height:30px;line-height: 30px;color:#303033}
</style>
<template>
	<view class="m-app">
		<form report-submit="true" @submit="formSubmit">
		<view class='form-body'>
			<view class="form-title">
				修改群昵称后，只会此群内显示，群内成员都可以看到。
			</view>
			<view class="form-content fx-r">
				<image :src="img == '' ? '/static/chat/group_chat.png' : img"  mode="aspectFill"></image>
				<input class="form-input" type="text" name="name" :value="name"/>
			</view>
			<view class="form-msg">限4-16个字符，一个汉字为两个字符</view>
			<button class="nt sub-btn" formType="submit">确认保存</button>
		</view>
		</form>
	</view>
</template>

<script>
	import {mapState,mapMutations} from 'vuex'
	export default {
		computed: mapState(['user']),
		data() {
			return {
				name 	: "",
				img  	: "",
				groupId : 0
			}
		},
		onLoad(options) {
			this.name = options.name || "";
			this.img  = options.img || "";
			this.groupId = options.groupId || 0;
			
		},
		methods: {
			formSubmit:function(e){
				var that = this , formData = e.detail.value;
				if(!this.utils.isDefine(formData.name)){
					this.utils.Tip("请输入群昵称");
					return;
				}
				this.utils.loadIng("提交中..")
				this
					.request
					.post("chatGroupEditRemark",{
						groupId : this.groupId,
						name	: formData.name
					})
					.then(res=>{
						if(res.code == 200) {
							this.utils.Tip("修改成功");
							uni.$emit('glRkName',{groupId:this.groupId,name:formData.name});
							setTimeout(function(){ uni.navigateBack();},1000);
						}else{
							that.utils.Tip(res.msg);
						}
					}).catch(function(){
						that.utils.Tip("网络错误，请稍后尝试");
					});
			}
			
		},
	}
</script>
