<!--详情底部-->
<template>
	<el-row :gutter="20">
		<el-col :span="14">
			<!--评论区-->
			<div class="comment"  v-for="item in state.commentList">
				<el-row :gutter="20">
					<el-col :span="3">{{ item.userName }}</el-col>
					<el-col :span="6">
						<span class="time">
				{{item.createTime}}
						</span>
					</el-col>
				</el-row>
				<div class="content">
					{{ item.content }}
				</div>
					<el-divider />
				</div>
		</el-col>
		<!--热门-->
		<el-col :span="10">
			<item2></item2>
		</el-col>
	</el-row>
</template>
<script setup lang="ts">
import Item2 from '~/components/front/item2.vue'
const  state =reactive(<any>{
	commentList:[
		{userName:"小人",content:"的电影影视作品,影片的导演是凯莉",createTime:"2024-09-30 23:15:50"},
		{userName:"小人",content:"的电影影视作品,影片的导演是凯莉",createTime:"2024-09-30 23:15:50"},
		{userName:"小人",content:"的电影影视作品,影片的导演是凯莉",createTime:"2024-09-30 23:15:50"},
		{userName:"小人",content:"的电影影视作品,影片的导演是凯莉",createTime:"2024-09-30 23:15:50"},
		{userName:"小人",content:"的电影影视作品,影片的导演是凯莉",createTime:"2024-09-30 23:15:50"},
	]
})
</script>
<style scoped>
.comment{
	color: #666;
	font-size: 13px;
	word-wrap: break-word;
	.content{
		padding-top: 15px;
	}
	.time{
		color: #aaa;
	}
}
:deep(.el-image){
	border-radius: 10px;
	height: 420px;
	margin-left: 30px;

}
</style>
