<template>
	<view>
		<view class="message">
			<view class="title">
				备注
				<text class="iconfont iconguanbi1" @click="close('remark')"></text>
			</view>
			<view class="textarea-box">
				<textarea v-model="remark" class="textarea" maxlength="200" placeholder="输入请不多于200字"></textarea>
			</view>
			<button @click="save" type="primary" class="primary-btn btn save">保存</button>
		</view>
	</view>
</template>

<script>
	
	export default{
		data(){
			return{
				judge:false,
				remark:''
			}
		},
		props:{
			message:{
				type:String,
				default:''
			},
			popup_name:{
				type:String,
				default:''
			}
		},
		mounted() {
			this.remark = JSON.parse(JSON.stringify(this.message));
		},
		methods:{
			save(){
				if(this.judge) return false;
				this.judge = true;
				
				console.log(this.remark)
				this.$emit('remark',this.remark,()=>{
					this.judge = false;
				});
			},
			close(name){
				this.$emit('close',name)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.message{
		width: 5.2rem;
		min-height: 3.2rem;
		border-radius: .06rem;
		background: #FFFFFF;
		padding-bottom: .15rem;
		.title{
			width: 100%;
			height: .5rem;
			border-bottom: .01rem solid #e6e6e6;
			text-align: center;
			line-height: .5rem;
			font-size: .16rem;
			font-weight: bold;
			position:relative;
			.iconguanbi1{
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				right: .15rem;
				font-size: .18rem;
			}
		}
		.textarea-box{
			margin: .15rem;
			height: 2.2rem;
			border:.01rem solid #e6e6e6;
			border-radius: .06rem;
			padding: .15rem;
			box-sizing: border-box;
			.textarea{
				width: 100%;
				height: 100%;
			}
		}
		.save{
			width: auto !important;
			float: right;
			margin-right: .15rem;
		}
	}
	.message:after{
		overflow: hidden;
		display: block;
		content: "";
		height: 0;
		clear: both;
	}
</style>
