<template>
	<view>
		<scroll-view scroll-y="true" :scroll-top="scrollTop" style="height: calc( 100vh - 166rpx);">
			<view style="padding:10rpx 30rpx;" v-for="(item,index) in list" :key="index">
				<view class="u-flex u-row-between" style="align-items: end;">
					<image src="../../static/profile/answer@2x.png" :class="{'noshow':item.type==1}" mode="" style="width: 52rpx;height: 52rpx;"></image>
					<view class="" style="width: 570rpx;
background: #FFFFFF;
border-radius: 20rpx;padding: 20rpx;box-sizing: border-box;">
						{{item.answer}}
					</view>
					<image src="../../static/profile/quetion@2x.png" mode="" :class="{'noshow':item.type==2}" style="width: 52rpx;height: 52rpx;"></image>
				</view>
			</view>
		</scroll-view>
		<view class="u-flex u-row-between" style="width: 750rpx;
height: 166rpx;
background: #FFFFFF;padding: 16rpx 30rpx;box-sizing: border-box;position: fixed;bottom: 0;">
			<input type="text" style="width: 590rpx;
height: 72rpx;
background: #F3F3F3;
border-radius: 36rpx;padding-left:20rpx ;" v-model="content" placeholder="请详细描述您需要咨询的问题">
<text @click="tosend">发送</text>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad(option) {
			this.id=option.id
		this.getList()	
		},
		data() {
			return {
				list:[],
				content:'',
				scrollTop:0
			}
		},
		methods: {
			tosend(){
				if(!this.content){
					this.$u.toast('请输入要咨询的问题')
					return
				}else{
					uni.$u.http.post('/api/index/answer',{e_id:this.id,answer:this.content}).then(res => {
						if(res.code==1){
							this.content=''
							this.getList()	
						}
					})
				}
			},
			getList(){
				uni.$u.http.post('/api/index/answer_log',{e_id:this.id}).then(res => {
					if(res.code==1){
						this.list=res.data
						this.$nextTick(function() {
						                this.scrollTop = new Date().getTime()
						            });
					}
				})
			}
		}
	}
</script>

<style>
	.noshow{
		opacity: 0;
	}
page{
	background: #F3F3F3;
}
</style>
