<template>
	<view class="chat">
		<list>
			<cell v-for="(item, index) in 99" :key="index">消息{{index}}</cell>
		</list>
		<!-- <view class="chat-soll">
			<view v-for="(item, index) in 50" :key="index">{{item}}滚动的聊天记录</view>
		</view>
		<view class="chat-footer">
			<view class="chat-inputs">
				<view class="chat-icon">
					<image src="@/static/im/icon_01.png" mode="widthFix"></image>
				</view>
				<input class="chat-input" type="text" placeholder="输入框" confirm-type="send">
				<view class="chat-icon">
					<image src="@/static/im/icon_02.png" mode="widthFix"></image>
				</view>
				<view class="chat-icon">
					<image src="@/static/im/icon_00.png" mode="widthFix"></image>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
	.chat{
		background: #ddd;
		height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		.chat-soll{
			flex: 1;
			overflow-y: scroll;
		}
		.chat-footer{
			background: white;
			padding: 30rpx 30rpx 60rpx 30rpx;
			.chat-inputs{
				display: flex;
				background: #f6f7f9;
				height: 80rpx;
				border-radius: 40rpx;
				.chat-input{
					width: calc(100% - 240rpx);
					height: 80rpx;
					line-height: 80rpx;
				}
				.chat-icon{
					width: 80rpx;
					image{
						width: 80rpx;
					}
				}
			}
		}
	}
</style>
