<template>
	<view class="comment-dialog-shadow" v-if="showComment">
		<view class="comment-edit-box">
			<textarea v-model="commentContent" :placeholder="placeholder" class="textarea"></textarea>
			<view class="btns">
				<button class="btn" size="mini" @click="handleCloseComment">取消</button>
				<button class="btn" size="mini" type="primary" @click="handlePublishComment">确定</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {publishComment} from '@/api/api.js'
	export default {
		name:"PublishComment",
		data() {
			return {
				showComment:false,
				commentContent:'',
				placeholder:'请输入评论',
				parentId:'',
			};
		},
		props: {
			form: {
				type: Object,
				default: {}
			}
		},
		methods:{
			openModal(item){
				this.showComment = true;
				if(item){
					// 不为空为回复
					this.parentId = item.id;
					this.placeholder = '回复：'+item.nickName
				}
			},
			// 关闭评论区
			handleCloseComment() {
				this.commentContent = ''
				this.showComment = false
			},
			// 发布评论
			handlePublishComment() {
				let data = {
					momentId: this.form.id,
					parentId: this.parentId,
					content: this.commentContent
				}
				publishComment(data).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: '评论发布成功'
						})
						this.handleCloseComment()
						this.$emit('refresh')
					}
				})
			},
		}
	}
</script>


<style lang="scss">
	@import '@/static/styles/index.scss';
</style>
