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

注释代码

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

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

@ -1,60 +1,15 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page isELIgnored="true" %>
<!-- 轮播图管理 -->
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta charset="UTF-8">
<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 -->
<link rel="stylesheet" href="../../css/common.css" />
<link rel="stylesheet" href="../../css/common.css">
</head>
<style>
.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">
<!-- 轮播图 -->
@ -65,7 +20,6 @@
</div>
</div>
</div>
<!-- 轮播图 -->
<div id="breadcrumb">
<span class="en">DATA SHOW</span>
@ -73,55 +27,42 @@
</div>
<!-- 图文列表 -->
<div class="recommend" :style='{"padding":"0","margin":"0px auto","flexWrap":"wrap","background":"none","display":"flex","width":"100%","position":"relative"}'>
<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"}'>
<div :style='{"padding":"0","margin":"0px auto","flexWrap":"wrap","background":"none","display":"flex","width":"100%","position":"relative"}' class="recommend">
<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 class="lable" :style='{"width":"auto","padding":"0 10px","lineHeight":"42px"}'>名称</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">
<div class="lable-input">名称</div>
<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>
<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">
<i :style='{"color":"#fff","margin":"0 10px 0 0","fontSize":"14px"}' class="layui-icon layui-icon-search"></i>搜索
</button>
<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 :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>
<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">
<i :style='{"color":"#fff","margin":"0 10px 0 0","fontSize":"14px"}' class="layui-icon">&#xe654;</i>新增
</button>
</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='{"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 :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">
<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 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">
<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.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>
</div>
</div>
</div>
<div class="pager" id="pager"></div>
</div>
<div class="pager" id="pager"></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 type="text/javascript" src="../../js/jquery.js"></script>
<script>
var vue = new Vue({
el: '#app',
@ -130,7 +71,6 @@
swiperList: [{
img: '../../img/banner.jpg'
}],
baseurl: '',
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() {
var form = layui.form;
var layer = layui.layer;
@ -187,8 +159,6 @@
}
});
// 分页列表
pageList();
@ -203,18 +173,13 @@
limit: limit
}
if (jquery('#name').val()) {
param['name'] = jquery('#name').val() ? '%' + jquery('#name').val() + '%' : '';
}
if (jquery('#name').val()) {
param['name'] = jquery('#name').val() ? '%' + jquery('#name').val() + '%' : '';
}
// 获取列表数据
http.request('config/list', 'get', param, function(res) {
vue.dataList = res.data.list
vue.dataList = res.data.list;
// 分页
laypage.render({
elem: 'pager',
@ -229,12 +194,12 @@
// 首次不执行
if (!first) {
http.request('config/list', 'get', param, function(res) {
vue.dataList = res.data.list
})
vue.dataList = res.data.list;
});
}
}
});
})
});
}
});
</script>

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

@ -1,21 +1,15 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page isELIgnored="true" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="true" %>
<!-- 论坛中心 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<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="../../css/style.css" />
<!-- 主题（主要颜色设置） -->
<link rel="stylesheet" href="../../layui/css/layui.css">
<!-- 主题颜色（主要颜色设置） -->
<link rel="stylesheet" href="../../css/theme.css" />
<!-- 通用的css -->
<link rel="stylesheet" href="../../css/common.css" />
</head>
<style>
.forum-container .btn-container {
display: flex;
@ -37,12 +31,13 @@
margin: 0 0 0 10px;
}
</style>
</head>
<body>
<div id="app">
<!-- 轮播图 -->
<div id="layui-carousel" class="layui-carousel">
<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" />
</div>
</div>
@ -58,7 +53,7 @@
<div class="forum-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">
<i class="layui-icon layui-icon-search"></i>搜索
</button>
@ -67,7 +62,7 @@
</button>
</div>
<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>
<div class="create-time">
{{item.addtime}}
@ -77,17 +72,11 @@
<div class="pager" id="pager"></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>
var vue = new Vue({
@ -196,7 +185,6 @@
});
})
}
});
</script>
</body>

Write Preview
Loading…
Cancel
Save