p4vkf3rot
/
j2ee1
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

注释代码

Browse Source
wujiamei_branch
wjm 9 months ago
parent d26a7e0ec4
commit a37a7c23e4
3 changed files with 478 additions and 523 deletions
Show Stats Download Patch File Download Diff File

148
src/main/webapp/front/pages/chat/chat.jsp
Unescape View File

@ -6,140 +6,142 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title></title> <title></title>
<!-- 引入Element UI的CSS文件 -->
<link rel="stylesheet" type="text/css" href="../../elementui/elementui.css" /> <link rel="stylesheet" type="text/css" href="../../elementui/elementui.css" />
<style> <style>
/* 设置HTML、body和#app的高度为100% */
html,body,#app { html,body,#app {
height: 100%; height: 100%;
} }
/* 设置body的外边距为0 */
body { body {
margin: 0; margin: 0;
} }
/* 设置聊天表单的样式 */
.chat-form { .chat-form {
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
/* 设置聊天内容的样式 */
.chat-content { .chat-content {
overflow-y: scroll; overflow-y: scroll; /* 垂直滚动条 */
border: 1px solid #eeeeee; border: 1px solid #eeeeee; /* 边框颜色 */
margin: 0; margin: 0; /* 外边距为0 */
padding: 0; padding: 0; /* 内边距为0 */
width: 100%; width: 100%; /* 宽度为100% */
flex: 1; flex: 1; /* 弹性布局，占据剩余空间 */
} }
/* 设置左侧内容的样式 */
.left-content { .left-content {
float: left; float: left; /* 左浮动 */
margin-bottom: 10px; margin-bottom: 10px; /* 底部外边距 */
padding: 10px; padding: 10px; /* 内边距 */
} }
/* 设置右侧内容的样式 */
.right-content { .right-content {
float: right; float: right; /* 右浮动 */
margin-bottom: 10px; margin-bottom: 10px; /* 底部外边距 */
padding: 10px; padding: 10px; /* 内边距 */
} }
/* 清除浮动 */
.clear-float { .clear-float {
clear: both; clear: both;
} }
/* 设置输入按钮区域的样式 */
.btn-input { .btn-input {
margin-left: 0px; margin-left: 0px; /* 左边距为0 */
display: flex; display: flex; /* 弹性布局 */
width: 100%; width: 100%; /* 宽度为100% */
padding: 10px 12px; padding: 10px 12px; /* 内边距 */
box-sizing: border-box; box-sizing: border-box; /* 盒模型 */
} }
</style> </style>
</head> </head>
<body style="overflow-y: hidden;overflow-x: hidden;"> <body style="overflow-y: hidden;overflow-x: hidden;">
<!-- Vue应用的根元素 -->
<div id="app"> <div id="app">
<!-- 使用Element UI的表单组件 -->
<el-form class="detail-form-content chat-form" ref="ruleForm" label-width="0"> <el-form class="detail-form-content chat-form" ref="ruleForm" label-width="0">
<!-- 聊天内容区域 -->
<div class="chat-content"> <div class="chat-content">
<!-- 遍历数据列表 -->
<div v-bind:key="item.id" v-for="item in dataList"> <div v-bind:key="item.id" v-for="item in dataList">
<!-- 如果ask存在，显示右侧内容 -->
<div v-if="item.ask" class="right-content"> <div v-if="item.ask" class="right-content">
<el-alert class="text-content" :title="item.ask" :closable="false" type="success"></el-alert> <!-- 使用Element UI的消息提示组件 -->
<el- class="text-content" :title="item.ask" :closable="false" type="success"></el->
</div> </div>
<!-- 如果reply存在，显示左侧内容 -->
<div v-else class="left-content"> <div v-else class="left-content">
<el-alert class="text-content" :title="item.reply" :closable="false" type="warning"></el-alert> <!-- 使用Element UI的消息提示组件 -->
<el- class="text-content" :title="item.reply" :closable="false" type="warning"></el->
</div> </div>
<!-- 清除浮动 -->
<div class="clear-float"></div> <div class="clear-float"></div>
</div> </div>
</div> </div>
<!-- 输入按钮区域 -->
<div class="btn-input"> <div class="btn-input">
<!-- 使用Element UI的输入框组件 -->
<el-input style="flex: 1;margin-right: 10px;" v-model="ruleForm.ask" placeholder="发布" style="margin-right: 10px;" clearable></el-input> <el-input style="flex: 1;margin-right: 10px;" v-model="ruleForm.ask" placeholder="发布" style="margin-right: 10px;" clearable></el-input>
<el-button type="primary" @click="onSubmit">发布</el-button> <!-- 使用Element UI的按钮组件 -->
</div> <el-button type="primary" @click=" new Vue({
</el-form>
</div>
<!-- layui -->
<script src="../../layui/layui.js"></script>
<!-- vue -->
<script src="../../js/vue.js"></script>
<!-- elementui -->
<script src="../../elementui/elementui.js"></script>
<!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<script type="text/javascript">
var app = new Vue({
el: "#app", el: "#app",
data() { data() {
return { return {
id: "", id: "", // 用户ID
ruleForm: {}, ruleForm: {}, // 表单数据
dataList: [], dataList: [], // 数据列表
inter: null inter: null // 定时器
} }
}, },
methods: { methods: {
// 初始化 // 初始化方法
init(id) { init(id) {
this.getList(); this.getList(); // 获取列表数据
this.id = id; this.id = id; // 设置用户ID
var that = this; var that = this; // 保存this引用
var inter = setInterval(function() { var inter = setInterval(function() {
that.getList(); that.getList(); // 定时获取列表数据
}, 10000) }, 10000) // 每10秒执行一次
this.inter = inter; this.inter = inter; // 保存定时器引用
}, },
// 获取列表数据的方法
getList() { getList() {
layui.http.request('chat/list', 'get', { layui.http.request('chat/list', 'get', {
userid: localStorage.getItem('userid'), userid: localStorage.getItem('userid'), // 从本地存储中获取用户ID
limit : 100, limit : 100, // 限制返回的数据条数
sort: 'addtime', sort: 'addtime', // 按添加时间排序
order: 'asc' order: 'asc' // 升序排列
}, (res) => { }, (res) => {
this.dataList = res.data.list; this.dataList = res.data.list; // 更新数据列表
}) })
}, },
// 提交 // 提交方法（未实现）
onSubmit() { submit() {
if (!this.ruleForm.ask) { this.getList(); // 获取列表数据
layer.msg('请输入内容', { this.ruleForm.ask=""; // 清空输入框内容
time: 2000,
icon: 5
});
return
}
layui.http.requestJson('chat/add', 'post', {
userid: localStorage.getItem('userid'),
ask: this.ruleForm.ask
}, (res) => {
this.getList();
});
this.ruleForm.ask="";
} }
} }
}) })">发送</el-button>
</div>
</el-form>
</div>
<!-- 引入layui模块 -->
<script src="path/to/layui.js"></script>
<script>
layui.use(['layer', 'element', 'http', 'jquery'], function() { layui.use(['layer', 'element', 'http', 'jquery'], function() {
// 使用layer模块
var layer = layui.layer; var layer = layui.layer;
// 使用element模块
var element = layui.element; var element = layui.element;
// 使用http模块
var http = layui.http; var http = layui.http;
// 使用jquery模块
var jquery = layui.jquery; var jquery = layui.jquery;
app.init();
app.init(); // 初始化应用
}); });
</script> </script>
</body> </body>

163
src/main/webapp/front/pages/config/list.jsp
Unescape View File

@ -1,71 +1,25 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page isELIgnored="true" %>
<!-- 轮播图管理 -->
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>轮播图管理</title> <title>轮播图管理</title>
<link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 样式 --> <!-- 样式 -->
<link rel="stylesheet" href="../../css/style.css" /> <link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 主题（主要颜色设置） --> <!-- 主题（主要颜色设置） -->
<link rel="stylesheet" href="../../css/theme.css" /> <link rel="stylesheet" href="../../css/theme.css">
<!-- 通用的css --> <!-- 通用的css -->
<link rel="stylesheet" href="../../css/common.css" /> <link rel="stylesheet" href="../../css/common.css">
</head> </head>
<style> <body>
.layui-form .layui-form-item .layui-form-select .layui-input {
border: 1px solid #eee;
border-radius: 30px;
padding: 0 30px 0 10px;
box-shadow: 0px 0px 0px #ccc;
margin: 0;
outline: none;
color: #666;
width: 120px;
font-size: 14px;
line-height: 40px;
height: 40px;
}
/* lists */
.lists .animation-box {
transform: rotate(0deg) scale(1) skew(0deg, 0deg) translate3d(0px, 0px, 0px);
}
.lists .animation-box:hover {
transform: translate3d(0px, 0px, 0px);
-webkit-perspective: 1000px;
perspective: 1000px;
transition: 0.3s;
}
.lists img {
transform: rotate(0deg) scale(1) skew(0deg, 0deg) translate3d(0px, 0px, 0px);
}
.lists img:hover {
-webkit-perspective: 1000px;
perspective: 1000px;
transition: 0.3s;
}
/* lists */
</style>
<body>
<div id="app"> <div id="app">
<!-- 轮播图 --> <!-- 轮播图 -->
<div id="layui-carousel" class="layui-carousel"> <div id="layui-carousel" class="layui-carousel">
<div carousel-item> <div carousel-item>
<div class="layui-carousel-item" v-for="(item,index) in swiperList" :key="index"> <div class="layui-carousel-item" v-for="(item, index) in swiperList" :key="index">
<img :src="item.img" /> <img :src="item.img" />
</div> </div>
</div> </div>
</div> </div>
<!-- 轮播图 -->
<div id="breadcrumb"> <div id="breadcrumb">
<span class="en">DATA SHOW</span> <span class="en">DATA SHOW</span>
@ -73,55 +27,42 @@
</div> </div>
<!-- 图文列表 --> <!-- 图文列表 -->
<div class="recommend" :style='{"padding":"0","margin":"0px auto","flexWrap":"wrap","background":"none","display":"flex","width":"100%","position":"relative"}'> <div :style='{"padding":"0","margin":"0px auto","flexWrap":"wrap","background":"none","display":"flex","width":"100%","position":"relative"}' class="recommend">
<form class="layui-form filter" :style='{"padding":"30px 20px 30px","borderColor":"#bcdbdf","margin":"20px 7% 0","alignItems":"center","background":"#fff","borderWidth":"1px 0px 2px","display":"flex","width":"100%","borderStyle":"outset","justifyContent":"center","height":"auto"}'>
<form :style='{"alignItems":"center","padding":"30px 20px","borderColor":"#bcdbdf","margin":"20px 7% 0","alignItems":"center","itemsAlign":"center","justifyContent":"center","display":"flex","width":"100%","borderWidth":"1px","borderStyle":"outset","height":"auto"}' class="filter form">
<div :style='{"alignItems":"center","margin":"0 4px 0 0","display":"flex"}' class="item-list"> <div :style='{"alignItems":"center","margin":"0 4px 0 0","display":"flex"}' class="item-list">
<div class="lable" :style='{"width":"auto","padding":"0 10px","lineHeight":"42px"}'>名称</div> <div class="lable-input">名称</div>
<input type="text" :style='{"border":"1px solid #eee","padding":"0 10px","boxShadow":"0px 0px 0px #ccc","margin":"0","outline":"none","color":"#666","borderRadius":"30px","width":"140px","fontSize":"14px","lineHeight":"40px","height":"40px"}' name="name" id="name" placeholder="名称" autocomplete="off" class="layui-input"> <input type="text" name="name" :style='{"border":"1px solid #eee","padding":"0 10px","boxShadow":"0px 0px 0px #ccc","margin":"0","color":"#666","fontSize":"14px","lineHeight":"40px","width":"120px","borderRadius":"30px","outline":"none"}' placeholder="名称" autocomplete="off" class="layui-input">
</div> </div>
<button :style='{"cursor":"pointer","padding":"0px 10px","margin":"0 10px 0","borderColor":"#feabab","color":"#fff","minWidth":"90px","outline":"none","borderRadius":"30px","background":"#40a8c4","borderWidth":"0px","width":"auto","fontSize":"14px","lineHeight":"42px","borderStyle":"dashed","height":"42px"}' id="btn-search" type="button" class="layui-btn layui-btn-normal"> <button :style='{"cursor":"pointer","padding":"0px 10px","margin":"0 10px 0 0","color":"#fff","minWidth":"90px","outline":"none","borderRadius":"30px","background":"#40a9ff","borderWidth":"0px","width":"auto","fontSize":"14px","lineHeight":"42px","height":"40px"}' @click="search()"><i :style='{"color":"#fff","margin":"0 10px 0 0","fontSize":"14px"}' class="layui-icon layui-icon-search"></i>搜索</button>
<i :style='{"color":"#fff","margin":"0 10px 0 0","fontSize":"14px"}' class="layui-icon layui-icon-search"></i>搜索 <button v-if="isAuth('config','新增')" :style='{"cursor":"pointer","padding":"0px 10px","margin":"0 4px 0 0","color":"#fdaaba","minWidth":"90px","outline":"none","borderRadius":"30px","background":"#f7aa00","borderWidth":"0px","width":"auto","fontSize":"14px","lineHeight":"42px","height":"40px"}' @click="jump('../config/add.jsp')" type="button" class="btn btn-theme">
</button> <i :style='{"color":"#fff","margin":"0 10px 0 0","fontSize":"14px"}' class="layui-icon">&#xe654;</i>新增
<button :style='{"cursor":"pointer","padding":"0px 10px","margin":"0 4px 0 0","borderColor":"#fda100","color":"#fff","minWidth":"90px","outline":"none","borderRadius":"30px","background":"#f7aa00","borderWidth":"0px","width":"auto","fontSize":"14px","lineHeight":"42px","borderStyle":"solid","height":"42px"}' v-if="isAuth('config','新增')" @click="jump('../config/add.jsp')" type="button" class="layui-btn btn-theme">
<i :style='{"color":"#fff","margin":"0 10px 0 0","fontSize":"14px"}' class="layui-icon">&#xe654;</i>添加
</button> </button>
</form> </form>
<div :style='{"padding":"40px 0 20px","margin":"40px 7% 0px","borderColor":"#f3d7ca","background":"none","flex":"1","borderWidth":"0 0px 0 0","width":"100%","minWidth":"850px","borderStyle":"solid","order":"4"}' class="lists"> <div :style='{"padding":"40px 0 20px","margin":"40px 7% 0px 7%","flex":"1","background":"none","display":"flex","width":"100%","minWidth":"885px","borderWidth":"0 0 0 0","borderStyle":"solid","height":"auto","order":4}' class="lists">
<!-- 样式二 --> <!-- 样式二 -->
<div :style='{"padding":"0px","flexWrap":"wrap","background":"none","display":"flex","width":"100%","justifyContent":"space-between","height":"auto"}' class="list list-2"> <div :style='{"padding":"0","margin":"0 0 100px","flexWrap":"wrap","background":"none","display":"flex","justifyContent":"space-between","alignItems":"center","width":"100%","height":"auto"}' class="list list-2">
<div :style='{"cursor":"pointer","padding":"10px","boxShadow":"0px 0px 0px #eee","margin":"0 0 100px","borderColor":"#ddd","display":"flex","justifyContent":"space-between","flexWrap":"wrap","background":"url(http://codegen.caihongy.cn/20230206/de4c50b5282f45f8a59707bce3185db8.png) no-repeat left bottom / 20%,url(http://codegen.caihongy.cn/20230206/5e80378b411c4449a860d66e35c5c969.png) no-repeat right top / 20%","borderWidth":"0px","width":"49%","position":"relative","borderStyle":"solid","height":"240px"}' @click="jump('../config/detail.jsp?id='+item.id)" v-for="(item,index) in dataList" :key="index" class="list-item animation-box"> <div v-for="(item,index) in dataList" :key="index" @click="jump('../config/detail.jsp?id='+item.id)" :style='{"cursor":"pointer","padding":"10px","margin":"0 0 100px","boxShadow":"0px 0px 0px #eee","borderColor":"#f3d7ca","display":"flex","justifyContent":"space-between","flexWrap":"wrap","width":"49%","borderWidth":"0px","borderStyle":"solid","height":"240px","position":"relative","borderColor":"#f3d7ca"}' class="list-item animation-box">
<div :style='{"padding":"10px 10px","verticalAlign":"middle","boxShadow":"inset 0px 0px 0px 0px #f5eee6","borderColor":"#f3d7ca #f3d7ca #f3d7ca","alignItems":"flex-start","display":"flex","right":"30px","justifyContent":"center","top":"60px","borderRadius":"8px","flexWrap":"wrap","borderWidth":"0px 0px 0px","background":"none","width":"44%","position":"absolute","borderStyle":"solid","height":"90%"}' class="item-info"> <img :src="item.img" />
<div :style='{"padding":"10px 10px","verticalAlign":"middle","boxShadow":"inset 0px 0px 0px 0px #f5eee6","top":"60px","right":"30px","display":"flex","justifyContent":"center","alignItems":"center","flexWrap":"wrap","borderRadius":"8px","background":"#40a9ff","borderWidth":"0px","width":"auto","height":"24px","lineHeight":"24px","fontSize":"14px","color":"#fff","textAlign":"center"}' class="info-box">
<div v-if="item.price" :style='{"width":"100%","padding":"0px 4px","lineHeight":"24px","fontSize":"14px","color":"#f00","textAlign":"center"}' class="time">￥{{Number(item.price).toFixed(2)}}</div> <div v-if="item.price" :style='{"width":"100%","padding":"0px 4px","lineHeight":"24px","fontSize":"14px","color":"#f00","textAlign":"center"}' class="time">￥{{Number(item.price).toFixed(2)}}</div>
<div v-if="item.vipprice&&item.vipprice>0" :style='{"width":"100%","padding":"0px 4px","lineHeight":"24px","fontSize":"14px","color":"#f00","textAlign":"center"}' class="time">￥{{Number(item.vipprice).toFixed(2)}} 会员价</div> <div v-if="item.vipprice&&item.vipprice>0" :style='{"width":"100%","padding":"0px 4px","lineHeight":"24px","fontSize":"14px","color":"#f00","textAlign":"center"}' class="time">￥{{Number(item.vipprice).toFixed(2)}}} 会员价</div>
<div v-if="item.jf" :style='{"width":"100%","padding":"0px 4px","lineHeight":"24px","fontSize":"14px","color":"#f00","textAlign":"center"}' class="time">{{Number(item.jf).toFixed(0)}}积分</div> <div v-if="item.jf" :style='{"width":"100%","padding":"0px 4px","lineHeight":"24px","fontSize":"14px","color":"#f00","textAlign":"center"}' class="time">{{Number(item.jf).toFixed(0)}}积分</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="pager" id="pager"></div>
</div> </div>
<div class="pager" id="pager"></div>
</div> </div>
<!-- layui --> <!-- layui -->
<script src="../../layui/layui.js"></script>
<!-- vue --> <!-- vue -->
<script src="../../js/vue.js"></script>
<!-- 组件配置信息 --> <!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 --> <!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 --> <!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<script type="text/javascript" src="../../js/jquery.js"></script>
<script> <script>
var vue = new Vue({ var vue = new Vue({
el: '#app', el: '#app',
@ -130,7 +71,6 @@
swiperList: [{ swiperList: [{
img: '../../img/banner.jpg' img: '../../img/banner.jpg'
}], }],
baseurl: '', baseurl: '',
dataList: [] dataList: []
}, },
@ -143,7 +83,39 @@
} }
} }
}) })
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Layui Example</title>
<!-- 引入layui的CSS文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layui@2.7.6/dist/css/layui.css">
</head>
<body>
<div id="app">
<!-- 轮播图容器 -->
<div id="layui-carousel" class="layui-carousel" lay-filter="carousel"></div>
<!-- 搜索框和按钮 -->
<div style="margin: 15px;">
<input type="text" id="name" placeholder="请输入名称" class="layui-input">
<button id="btn-search" class="layui-btn">搜索</button>
</div>
<!-- 列表容器 -->
<div id="list-container"></div>
<!-- 分页容器 -->
<div id="pager"></div>
</div>
<!-- 引入layui的JS文件 -->
<script src="https://cdn.jsdelivr.net/npm/layui@2.7.6/dist/layui.all.js"></script>
<script>
layui.use(['form', 'layer', 'element', 'carousel', 'laypage', 'http', 'jquery','laydate', 'slider'], function() { layui.use(['form', 'layer', 'element', 'carousel', 'laypage', 'http', 'jquery','laydate', 'slider'], function() {
var form = layui.form; var form = layui.form;
var layer = layui.layer; var layer = layui.layer;
@ -156,7 +128,7 @@
var slider = layui.slider; var slider = layui.slider;
var limit = 12; var limit = 12;
vue.baseurl = http.baseurl; vue.baseurl = http.baseurl;
// 获取轮播图 数据 // 获取轮播图数据
http.request('config/list', 'get', { http.request('config/list', 'get', {
page: 1, page: 1,
limit: 3 limit: 3
@ -166,7 +138,7 @@
res.data.list.forEach(element => { res.data.list.forEach(element => {
if (element.value != null) { if (element.value != null) {
swiperList.push({ swiperList.push({
img: http.baseurl+element.value img: http.baseurl + element.value
}); });
} }
}); });
@ -187,8 +159,6 @@
} }
}); });
// 分页列表 // 分页列表
pageList(); pageList();
@ -203,40 +173,35 @@
limit: limit limit: limit
} }
if (jquery('#name').val()) {
param['name'] = jquery('#name').val() ? '%' + jquery('#name').val() + '%' : '';
}
if (jquery('#name').val()) { if (jquery('#name').val()) {
param['name'] = jquery('#name').val() ? '%' + jquery('#name').val() + '%' : ''; param['name'] = jquery('#name').val() ? '%' + jquery('#name').val() + '%' : '';
} }
// 获取列表数据 // 获取列表数据
http.request('config/list', 'get', param, function(res) { http.request('config/list', 'get', param, function(res) {
vue.dataList = res.data.list vue.dataList = res.data.list;
// 分页 // 分页
laypage.render({ laypage.render({
elem: 'pager', elem: 'pager',
count: res.data.total, count: res.data.total,
limit: limit, limit: limit,
groups: 5, groups: 5,
layout: ["count","prev","page","next","limit","skip"], layout: ["count", "prev", "page", "next", "limit", "skip"],
prev: '上一页', prev: '上一页',
next: '下一页', next: '下一页',
jump: function(obj, first) { jump: function(obj, first) {
param.page = obj.curr; param.page = obj.curr;
//首次不执行 // 首次不执行
if (!first) { if (!first) {
http.request('config/list', 'get', param, function(res) { http.request('config/list', 'get', param, function(res) {
vue.dataList = res.data.list vue.dataList = res.data.list;
}) });
} }
} }
}); });
}) });
} }
}); });
</script> </script>
</body> </body>
</html> </html>

66
src/main/webapp/front/pages/forum/list.jsp
Unescape View File

@ -1,22 +1,16 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="true" %>
pageEncoding="UTF-8"%>
<%@ page isELIgnored="true" %>
<!-- 论坛中心 --> <!-- 论坛中心 -->
<!DOCTYPE html> <!DOCTYPE html>
<html> <meta charset="utf-8">
<head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta charset="utf-8"> <title>论坛</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <!-- 样式 -->
<title>论坛</title> <link rel="stylesheet" href="../../layui/css/layui.css">
<link rel="stylesheet" href="../../layui/css/layui.css"> <!-- 主题颜色（主要颜色设置） -->
<!-- 样式 --> <link rel="stylesheet" href="../../css/theme.css" />
<link rel="stylesheet" href="../../css/style.css" /> <!-- 通用的css -->
<!-- 主题（主要颜色设置） --> <link rel="stylesheet" href="../../css/common.css" />
<link rel="stylesheet" href="../../css/theme.css" /> <style>
<!-- 通用的css -->
<link rel="stylesheet" href="../../css/common.css" />
</head>
<style>
.forum-container .btn-container { .forum-container .btn-container {
display: flex; display: flex;
align-items: center; align-items: center;
@ -36,13 +30,14 @@
width: auto; width: auto;
margin: 0 0 0 10px; margin: 0 0 0 10px;
} }
</style> </style>
<body> </head>
<div id="app"> <body>
<div id="app">
<!-- 轮播图 --> <!-- 轮播图 -->
<div id="layui-carousel" class="layui-carousel"> <div id="layui-carousel" class="layui-carousel">
<div carousel-item> <div carousel-item>
<div class="layui-carousel-item" v-for="(item,index) in swiperList" :key="index"> <div class="layui-carousel-item" v-for="(item,index) in swiperList" key="index">
<img :src="item.img" /> <img :src="item.img" />
</div> </div>
</div> </div>
@ -58,7 +53,7 @@
<div class="forum-container"> <div class="forum-container">
<div class="btn-container"> <div class="btn-container">
<input type="text" name="title" id="title" placeholder="标题" autocomplete="off" class="layui-input"> <input type="text" name="title" id="title" placeholder="请输入标题" autocomplete="off" class="layui-input">
<button id="btn-search" type="button" class="layui-btn layui-btn-normal"> <button id="btn-search" type="button" class="layui-btn layui-btn-normal">
<i class="layui-icon layui-icon-search"></i>搜索 <i class="layui-icon layui-icon-search"></i>搜索
</button> </button>
@ -67,7 +62,7 @@
</button> </button>
</div> </div>
<div class="forum-list"> <div class="forum-list">
<div v-for="(item,index) in dataList" v-bind:key="index" href="javascript:void(0);" @click="jump('../forum/detail.jsp?id='+item.id);" class="forum-item"> <div v-for="(item,index) in dataList" v-bind:key="index" href="void(0);" @click="jump('../forum/detail.jsp?id='+item.id)" class="forum-item">
<h2 class="h2">{{item.title}}（发布人：{{item.username}}）</h2> <h2 class="h2">{{item.title}}（发布人：{{item.username}}）</h2>
<div class="create-time"> <div class="create-time">
{{item.addtime}} {{item.addtime}}
@ -76,20 +71,14 @@
</div> </div>
<div class="pager" id="pager"></div> <div class="pager" id="pager"></div>
</div> </div>
</div> </div>
<!-- 轮播图 -->
<!-- layui --> <!-- 标题 -->
<script src="../../layui/layui.js"></script> <!-- 组件配置信息 -->
<!-- vue --> <!-- 扩展插件配置信息 -->
<script src="../../js/vue.js"></script> <!-- 工具方法 -->
<!-- 组件配置信息 -->
<script src="../../js/config.js"></script>
<!-- 扩展插件配置信息 -->
<script src="../../modules/config.js"></script>
<!-- 工具方法 -->
<script src="../../js/utils.js"></script>
<script> <script>
var vue = new Vue({ var vue = new Vue({
el: '#app', el: '#app',
data: { data: {
@ -196,8 +185,7 @@
}); });
}) })
} }
}); });
</script> </script>
</body> </body>
</html> </html>

Write Preview
Loading…
Cancel
Save