<template>
	<view class="synopsis white_style">
		<Nav className="nav_F6" :backVisible="true" :saveVisible="true" @savePick="saveBefore" :notNull="form.introduction" :scroll="scroll">
			<block slot="content" class="omit">{{ $t('team.synopsis.title') }}</block>
		</Nav>
		<view class="body_scroll clearfix" :style="getHeight">
			<view class="synopsis_form">
				<view class="item">
					<view class="title">小目标</view>
					<view class="content">
						<textarea :show-confirm-bar="false" class="uni-textarea" placeholder-class="uni-placeholder__class" v-model.trim="form.introduction" :maxlength="300" @input="bindInput" placeholder="定个小目标,邀小伙伴一起助力实现..." auto-height />
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import mixins from '@/utils/mixins'
	import imgDict from '@/utils/img'

	export default {
		mixins: [mixins],
		data() {
			return {
				imgDict,
				form: {
					updateBy: uni.getStorageSync('uid'),
					introduction: ''
				},
				rules: [
					{ name: 'introduction', errorMsg: '请输入小目标' }
				]
			}
		},
		onLoad (e) {
			if (e) {
				this.form.id = e.teamId
				this.form.introduction = e.name
			}
		},
		methods: {
			// 输入
			bindInput (e) {
				this.form.introduction = e.detail.value
			},
			// 保存前
			saveBefore () {
				this.$base.FORM_VERIFICATIONS(this.rules, this.form, () => {
					this.save()
				})
			},
			// 保存
			async save () {
				this.loading = true
				const result = await this.$axios.put(this.API.teamUpdate, this.form)
				this.loading = false
				if (result) {
					uni.$emit('teamVoiceRoom')
					uni.navigateBack()
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.synopsis {
		min-height: calc(100vh);

		.body_scroll {
			.synopsis_form {
				padding: 60rpx 26rpx 96rpx 26rpx;
				.item {
					background-color: $white;
					border-radius: 18rpx;
					padding: 36rpx;
					& + .item {
						margin-top: 70rpx;
					}
					.title {
						margin-bottom: 28rpx;
						line-height: 30rpx;
						font-size: 32rpx;
						font-weight: 400;
						color: $bg-0;
					}
					.content {
						.uni-textarea {
							border: 1px solid $ECECEC;
							border-radius: 18rpx;
							min-height: 252rpx;
							line-height: 42rpx;
							font-size: 30rpx;
							font-weight: 400;
							padding: 20rpx;
							color: $bg-0;
							/deep/ .uni-placeholder__class {
								color: $J49494;
							}
						}
					}
				}
			}
		}
	}
</style>
