<template>
	<view class="content">
		<!-- 页头 -->
		<view class="top">
			<image @click="back" :disabled="btnDisabled" class="back" :src="'../../static/icon/back.png'"></image>
			<view class="title">发布帖子</view>
			<image class="add" :src="'../../static/post/send.png'" @click="addPost"></image>
		</view>

		<!-- 输入文字内容 -->
		<view class="text-content">
			<u--textarea v-model="value1" placeholder="发布运动相关的图文，分享你的运动生活" height="200px"></u--textarea>
		</view>

		<!-- 上传图片区域 -->
		<view class="pic-content">
			<uni-file-picker v-model="imageValue" file-mediatype="image" mode="grid" file-extname="png,jpg" :limit="9"
				@select="select" @progress="progress" @success="success" @fail="fail" />
		</view>

	</view>
</template>

<script>
	import image from '../../uni_modules/uview-ui/libs/config/props/image'
	export default {
		data() {
			return {
				btnDisabled: false,
				value1: '',
				imageValue: [],
				img: []
			}
		},

		methods: {
			// 获取上传状态
			select(e) {

			},
			// 获取上传进度
			progress(e) {

			},

			// 上传成功
			success(e) {



			},

			// 上传失败
			fail(e) {
				console.log('上传失败：', e)
			},
			back() {
				uni.navigateBack({
					delta: 1, //返回层数，2则上上页
				})
			},
			addPost() {
				if (this.btnDisabled) {
					return
				}
				this.btnDisabled = true
				setTimeout(() => {
					this.btnDisabled = false
				}, 1000)
				
				var length = this.imageValue.length;
				for (var i = 0; i < length; i++) {
					this.img.push(this.imageValue[i].path);
				}
				if (length == 0 && this.value1 == '') {
					uni.showToast({
						title: '空内容不能发布呦',
						duration: 1000,
						icon: 'error'

					})
				} else {
					uniCloud.callFunction({
							name: 'fe-college-makePost',
							data: { //向云函数中传入的数据
								userId: getApp().globalData.userId,
								picture: this.img,
								content: this.value1,
							},
						})
						.then(res => {
							if (res.result.code == 200) {
								uni.showToast({
									title: '发布成功',
									duration:1000,
									success: () => {
										setTimeout(() => {
											uni.navigateBack();
										}, 800)
									}
								})
							}
							// console.log(res.result);
						});
				}

			}
		}
	}
</script>

<style>
	.top {
		width: 100%;
		height: 50px;
		background-color: #EDEEF0;
		text-align: center;
	}

	.back {
		width: 40px;
		height: 30px;
		margin-top: 10px;
		margin-bottom: 10px;
		float: left;
		margin-left: 10px;
	}

	.title {
		margin-top: 15px;
		display: inline-block;
	}

	.add {
		width: 30px;
		height: 30px;
		margin-top: 10px;
		float: right;
		margin-right: 10px;
	}

	.text-content {
		margin: 20px;
	}

	.pic-content {
		margin: 20px;
	}
</style>