src/main/webapp/front/pages/chat/chat.jsp

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page isELIgnored="true" %>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../elementui/elementui.css" />
		<style>
			.chat-content {
			  margin-left: 80px;
			  padding-bottom: 60px;
			  width: 500px;
			  margin-bottom: 30px;
			  max-height: 300px;
			  height: 300px;
			  overflow-y: scroll;
			  border: 1px solid #eeeeee;
			}
			.left-content {
			  float: left;
			  margin-bottom: 10px;
			  padding: 10px;
			}
			.right-content {
			  float: right;
			  margin-bottom: 10px;
			  padding: 10px;
			  margin-top: 40px;
			}
			.clear-float {
			  clear: both;
			}
		</style>
	</head>
	<body style="overflow-y: hidden;overflow-x: hidden;">
		<div id="app">
			<el-form class="detail-form-content" ref="ruleForm" label-width="80px">
				<div class="chat-content">
					<div v-bind:key="item.id" v-for="item in dataList">
						<div v-if="item.ask" class="left-content">
							<el-alert class="text-content" :title="item.ask" :closable="false" type="success"></el-alert>
						</div>
						<div v-if="item.reply" class="right-content">
							<el-alert class="text-content" :title="item.reply" :closable="false" type="warning"></el-alert>
						</div>
						<div class="clear-float"></div>
					</div>
				</div>
				<div class="clear-float"></div>
				<el-form-item label="发布" prop="ask">
					<el-input v-model="ruleForm.ask" placeholder="发布" clearable></el-input>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="onSubmit">发布</el-button>
				</el-form-item>
			</el-form>
		</div>