目录
项目使用:毕业设计、课程设计、大作业、项目练习、学习演示等...
想要源码的童鞋可以+本人QQ:203114746、QQ邮箱:203114746@qq.com、想学习的童鞋或者对IT行业感兴趣的也可以找我请教哦！！！本人是一个很热情的男孩子喔
一，登录功能
-
登录账号密码不能为空
-
登录账号密码输入正确即可进入首页
参考代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<html>
<head>
<!-- 引入公共文件 -->
<%@ include file="/common/head.jsp" %>
<!-- 引入登录.js -->
<script type="text/javascript">
layui.use(['jquery','layer'],function(){
let $=layui.jquery;
var layer = layui.layer;
$("#login").click(function(){
//获取账户和密码的值
let name=$("#username").val();
let pwd=$("#password").val();
console.info("账号"+name)
console.info("密码"+pwd)
//使用无刷新/userAction
$.post('userAction.action',{'loginName':name,'pwd':pwd,'methodName':'loginUser'},function(data){
console.info(data)
//判断
if(data.success){
layer.msg("网络正在拼命加载...",{
icon: 16,
time: 1000,
/* end:function(){
//跳转到主页面
layer.msg(data.msg,{icon:1})
}*/
},function(){
layer.msg(data.msg,{icon:6,time:500},function(){
location.href= ctx+"jsp/index.jsp";
})
});
}else{
// layer.msg("网络正在拼命加载...",{
//icon: 16,
//time: 1000,
//end:function(){
layer.msg(data.msg,{icon:5,anim: 6});
//}
// });
}
},"json");
});
});
</script>
<meta name="viewport" content="width=device-width,initial-scale=1.33,minimum-scale=1.0,maximum-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<title>会员登录-演示网站</title>
<meta http-equiv="Content-Language" content="zh-CN">
<style> body{color:#;}a{color:#;}a:hover{color:#;}.bg-black{background-color:#;}
.tx-login-bg{background:url(${ctx}/static/images/bg.jpg) no-repeat 0 0;}</style>
</head>
<body class="tx-login-bg">
<div class="tx-login-box">
<div class="login-avatar bg-black"><i class="iconfont icon-wode"></i></div>
<ul class="tx-form-li row">
<li class="col-24 col-m-24"><p><input type="text" id="username" autocomplete="off" placeholder="登录账号" class="tx-input"></p></li>
<li class="col-24 col-m-24"><p><input type="password" id="password" placeholder="登录密码" class="tx-input"></p></li>
<li class="col-24 col-m-24"><p class="tx-input-full"><button id="login" class="tx-btn tx-btn-big bg-black">登录</button></p></li>
<li class="col-12 col-m-12"><p><a href="#" class="f-12 f-gray"></a></p></li>
<li class="col-12 col-m-12"><p class="ta-r"><a href="#" class="f-12 f-gray"></a></p></li>
</ul>
</div>
</body>
</html>
二，首页
- 修改登录密码
参考代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>会员首页</title>
<!-- 引入公共文件 -->
<%@ include file="/common/head.jsp" %>
<style type="text/css">
/* 设置首页不可关闭 */
#first ul li:first-child i{
display:none;
}
</style>
<script type="text/javascript">
//定义一个全局element模块
var ele=null;
var $=null;
var layer=null;
//定义layui方法
layui.use(['jquery','element','layer'],function(){
$=layui.jquery;
ele=layui.element;
layer=layui.layer;
//发出请求
$.post('moduleAction.action',{"methodName":"listModule"},function(data){
if(data.success){
//获取集合数据
let d=data.data;
//遍历集合数据
$.each(d,function(index,node){
//判断 默认第一栏打开状态下标为0
let selected=index==0?'layui-nav-itemed':"";
//开始生成
let li=$('<li class="layui-nav-item '+selected+'"></li>');
//继续追加元素
li.append('<a class="" href="javascript:;">'+node.name+'</a>');
//判断子节点下面有没有子节点
let s=node.children;
//判断长度是否大于0
if(s.length>0){
//长度大于0 说明有节点
let dl=$('<dl class="layui-nav-child"></dl>');
//遍历节点 children
$.each(s,function(i,v){
//继续追加
dl.append('<dd><a href="javascript:openFun(\''+v.name+'\',\''+v.id+'\',\''+v.url+'\')">'+v.name+'</a></dd>');
});
//把dl给到li
li.append(dl);
};
//最终给到ul
$("#menu").append(li);
});
//渲染
ele.render('menu');
//ele.init();
}
},"json");
});
//定义打开新增选项卡的方法
function openFun(name,id,url){
//判断选项卡 是否被打开，被打开就不需要再打开，反之
let exit=$("li[lay-id='"+id+"']").length;
//判断 如果长度等于0就打开 反之
if(exit==0){
//新增一个Tab项
ele.tabAdd('demo', {
title: name //用于演示
,content: '<iframe id="if" frameborder="0px" style="width:100%;height:100%" src="'+ctx+url+'"></iframe>'
,id: id //实际使用一般是规定好的id，这里以时间戳模拟下
})
ele.tabChange('demo', id); //切换到所点击的选项卡
}else{
ele.tabChange('demo', id); //切换到所点击的选项卡
//window.location.reload(); //刷新页面
}
//ele.tabChange('demo', id); //切换到所点击的选项卡
//window.location.reload(); //刷新页面
//设置每次打开的页面大小
size();
$(window).resize(function(){
size();
})
/* ele.on('tab(demo)', function(data){
console.log(this); //当前Tab标题所在的原始DOM元素
console.log(data.index); //得到当前Tab的所在下标
console.log(data.elem); //得到当前的Tab大容器
}); */
/* ele.on('nav(demo)', function(elem){
alert(elem)
console.log(elem); //得到当前点击的DOM对象
}); */
}
//定义一个修改密码的方法
function updatePwd(){
layer.open({
type: 2,
title:'修改密码',
area: ['580px', '350px'],
content: ctx+'jsp/user/updatePwd.jsp' //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
});
}
function size(){
let h=$(".layui-body").height()-78;
$("#if").css("height",h+"px");
}
//返回登录的方法注销
function zx(){
location.href=ctx+"userAction.action?methodName=loginOut";
}
//隐藏导航或者显示导航
function editUl(){
$("#del").hide();
}
</script>
</head>
<body class="layui-layout-body" >
<!-- <iframe frameborder="0" src="'+url+'"></iframe> -->
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<div class="layui-logo">
<img alt="logo" style="width: 80%;height: 80%;margin: 5px;margin-left: -5px" src="https://www.tsinghua.edu.cn/image/logo180.png">
</div>
<!-- 头部区域（可配合layui已有的水平导航） -->
<ul class="layui-nav layui-layout-right">
<li class="layui-nav-item">
<a href="javascript:;">
<img src="https://img1.baidu.com/it/u=4222480351,1126889302&fm=253&fmt=auto&app=120&f=JPEG?w=750&h=1000" class="layui-nav-img">
${user.name }
</a>
<dl class="layui-nav-child">
<dd><a href="javascript:updatePwd()"><i class="layui-icon"></i> 修改密码</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="${ctx }/userAction.action?methodName=loginOut">退了</a></li>
</ul>
</div>
<div class="layui-side layui-bg-black" id="del">
<div class="layui-side-scroll">
<!-- 左侧导航区域（可配合layui已有的垂直导航） -->
<ul class="layui-nav layui-nav-tree" id="menu" lay-filter="test">
<!-- 生成动态书 -->
<!-- <li class="layui-nav-item layui-nav-itemed">
<a class="" href="javascript:;">所有商品</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">列表一</a></dd>
<dd><a href="javascript:;">列表二</a></dd>
<dd><a href="javascript:;">列表三</a></dd>
<dd><a href="">超链接</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">列表一</a></dd>
<dd><a href="javascript:;">列表二</a></dd>
<dd><a href="">超链接</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item"><a href="">发布商品</a></li> -->
</ul>
</div>
</div>
<div class="layui-body">
<!-- 内容主体区域 -->
<div style="padding: 15px;">
<!-- 新增选项卡 -->
<div class="layui-tab" id="first" lay-filter="demo" lay-allowclose="true">
<ul class="layui-tab-title">
<li class="layui-this" lay-id="11">首页</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<!-- 轮播图组件 -->
<div class="layui-carousel" id="test10">
<div carousel-item="">
<div><img style="width: 100%;height: 100%" src="static/images/u=851604471,3152281289&fm=253&fmt=auto&app=120&f=JPEG.webp"></div>
<div><img style="width: 100%;height: 100%" src="static/images/u=870681701,1413480604&fm=253&fmt=auto&app=120&f=JPEG.webp"></div>
</div>
</div>
<!-- 轮播图组件结束 -->
</div>
</div>
</div>
</div>
<div class="layui-footer">
<!-- 底部固定区域 -->
<center>© wx-joneclassmate 晓辉阁</center>
</div>
</div>
<script type="text/javascript">
layui.use(['carousel', 'form'], function(){
var carousel = layui.carousel
,form = layui.form;
//常规轮播
carousel.render({
elem: '#test1'
,arrow: 'always'
});
//改变下时间间隔、动画类型、高度
carousel.render({
elem: '#test2'
,interval: 1800
,anim: 'fade'
,height: '120px'
});
//设定各种参数
var ins3 = carousel.render({
elem: '#test3'
});
//图片轮播
carousel.render({
elem: '#test10'
,width: '100%'
,height: '87%'
,interval: 5000
});
//事件
carousel.on('change(test4)', function(res){
console.log(res)
});
var $ = layui.$, active = {
set: function(othis){
var THIS = 'layui-bg-normal'
,key = othis.data('key')
,options = {};
othis.css('background-color', '#5FB878').siblings().removeAttr('style');
options[key] = othis.data('value');
ins3.reload(options);
}
};
//监听开关
form.on('switch(autoplay)', function(){
ins3.reload({
autoplay: this.checked
});
});
$('.demoSet').on('keyup', function(){
var value = this.value
,options = {};
if(!/^\d+$/.test(value)) return;
options[this.name] = value;
ins3.reload(options);
});
//其它示例
$('.demoTest .layui-btn').on('click', function(){
var othis = $(this), type = othis.data('type');
active[type] ? active[type].call(this, othis) : '';
});
});
</script>
</body>
</html>三，会议发布
参考代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>会员首页</title>
<!-- 引入公共文件 -->
<%@ include file="/common/head.jsp" %>
<style type="text/css">
/* 设置首页不可关闭 */
#first ul li:first-child i{
display:none;
}
</style>
<script type="text/javascript">
//定义一个全局element模块
var ele=null;
var $=null;
var layer=null;
//定义layui方法
layui.use(['jquery','element','layer'],function(){
$=layui.jquery;
ele=layui.element;
layer=layui.layer;
//发出请求
$.post('moduleAction.action',{"methodName":"listModule"},function(data){
if(data.success){
//获取集合数据
let d=data.data;
//遍历集合数据
$.each(d,function(index,node){
//判断 默认第一栏打开状态下标为0
let selected=index==0?'layui-nav-itemed':"";
//开始生成
let li=$('<li class="layui-nav-item '+selected+'"></li>');
//继续追加元素
li.append('<a class="" href="javascript:;">'+node.name+'</a>');
//判断子节点下面有没有子节点
let s=node.children;
//判断长度是否大于0
if(s.length>0){
//长度大于0 说明有节点
let dl=$('<dl class="layui-nav-child"></dl>');
//遍历节点 children
$.each(s,function(i,v){
//继续追加
dl.append('<dd><a href="javascript:openFun(\''+v.name+'\',\''+v.id+'\',\''+v.url+'\')">'+v.name+'</a></dd>');
});
//把dl给到li
li.append(dl);
};
//最终给到ul
$("#menu").append(li);
});
//渲染
ele.render('menu');
//ele.init();
}
},"json");
});
//定义打开新增选项卡的方法
function openFun(name,id,url){
//判断选项卡 是否被打开，被打开就不需要再打开，反之
let exit=$("li[lay-id='"+id+"']").length;
//判断 如果长度等于0就打开 反之
if(exit==0){
//新增一个Tab项
ele.tabAdd('demo', {
title: name //用于演示
,content: '<iframe id="if" frameborder="0px" style="width:100%;height:100%" src="'+ctx+url+'"></iframe>'
,id: id //实际使用一般是规定好的id，这里以时间戳模拟下
})
ele.tabChange('demo', id); //切换到所点击的选项卡
}else{
ele.tabChange('demo', id); //切换到所点击的选项卡
//window.location.reload(); //刷新页面
}
//ele.tabChange('demo', id); //切换到所点击的选项卡
//window.location.reload(); //刷新页面
//设置每次打开的页面大小
size();
$(window).resize(function(){
size();
})
}
//定义一个修改密码的方法
function updatePwd(){
layer.open({
type: 2,
title:'修改密码',
area: ['580px', '350px'],
content: ctx+'jsp/user/updatePwd.jsp' //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
});
}
function size(){
let h=$(".layui-body").height()-78;
$("#if").css("height",h+"px");
}
//返回登录的方法注销
function zx(){
location.href=ctx+"userAction.action?methodName=loginOut";
}
//隐藏导航或者显示导航
function editUl(){
$("#del").hide();
}
</script>
</head>
<body class="layui-layout-body" >
<!-- <iframe frameborder="0" src="'+url+'"></iframe> -->
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<div class="layui-logo">
<img alt="logo" style="width: 80%;height: 80%;margin: 5px;margin-left: -5px" src="https://www.tsinghua.edu.cn/image/logo180.png">
</div>
<!-- 头部区域（可配合layui已有的水平导航） -->
<ul class="layui-nav layui-layout-right">
<li class="layui-nav-item">
<a href="javascript:;">
<img src="https://img1.baidu.com/it/u=4222480351,1126889302&fm=253&fmt=auto&app=120&f=JPEG?w=750&h=1000" class="layui-nav-img">
${user.name }
</a>
<dl class="layui-nav-child">
<dd><a href="javascript:updatePwd()"><i class="layui-icon"></i> 修改密码</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="${ctx }/userAction.action?methodName=loginOut">退了</a></li>
</ul>
</div>
<div class="layui-side layui-bg-black" id="del">
<div class="layui-side-scroll">
<!-- 左侧导航区域（可配合layui已有的垂直导航） -->
<ul class="layui-nav layui-nav-tree" id="menu" lay-filter="test">
<!-- 生成动态书 -->
<!-- <li class="layui-nav-item layui-nav-itemed">
<a class="" href="javascript:;">所有商品</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">列表一</a></dd>
<dd><a href="javascript:;">列表二</a></dd>
<dd><a href="javascript:;">列表三</a></dd>
<dd><a href="">超链接</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">列表一</a></dd>
<dd><a href="javascript:;">列表二</a></dd>
<dd><a href="">超链接</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item"><a href="">发布商品</a></li> -->
</ul>
</div>
</div>
<div class="layui-body">
<!-- 内容主体区域 -->
<div style="padding: 15px;">
<!-- 新增选项卡 -->
<div class="layui-tab" id="first" lay-filter="demo" lay-allowclose="true">
<ul class="layui-tab-title">
<li class="layui-this" lay-id="11">首页</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<!-- 轮播图组件 -->
<div class="layui-carousel" id="test10">
<div carousel-item="">
<div><img style="width: 100%;height: 100%" src="static/images/u=851604471,3152281289&fm=253&fmt=auto&app=120&f=JPEG.webp"></div>
<div><img style="width: 100%;height: 100%" src="static/images/u=870681701,1413480604&fm=253&fmt=auto&app=120&f=JPEG.webp"></div>
</div>
</div>
<!-- 轮播图组件结束 -->
</div>
</div>
</div>
</div>
<div class="layui-footer">
<!-- 底部固定区域 -->
<center>© wx-joneclassmate 晓辉阁</center>
</div>
</div>
<script type="text/javascript">
layui.use(['carousel', 'form'], function(){
var carousel = layui.carousel
,form = layui.form;
//常规轮播
carousel.render({
elem: '#test1'
,arrow: 'always'
});
//改变下时间间隔、动画类型、高度
carousel.render({
elem: '#test2'
,interval: 1800
,anim: 'fade'
,height: '120px'
});
//设定各种参数
var ins3 = carousel.render({
elem: '#test3'
});
//图片轮播
carousel.render({
elem: '#test10'
,width: '100%'
,height: '87%'
,interval: 5000
});
//事件
carousel.on('change(test4)', function(res){
console.log(res)
});
var $ = layui.$, active = {
set: function(othis){
var THIS = 'layui-bg-normal'
,key = othis.data('key')
,options = {};
othis.css('background-color', '#5FB878').siblings().removeAttr('style');
options[key] = othis.data('value');
ins3.reload(options);
}
};
//监听开关
form.on('switch(autoplay)', function(){
ins3.reload({
autoplay: this.checked
});
});
$('.demoSet').on('keyup', function(){
var value = this.value
,options = {};
if(!/^\d+$/.test(value)) return;
options[this.name] = value;
ins3.reload(options);
});
//其它示例
$('.demoTest .layui-btn').on('click', function(){
var othis = $(this), type = othis.data('type');
active[type] ? active[type].call(this, othis) : '';
});
});
</script>
</body>
</html>四，我的会议
- 可查看自己主持的会议
- 操作：排座，送审，查看用户反馈
排座：会议状态为新建or驳回
送审： 会议状态为新建or驳回
查看反馈信息：会议状态为待开
五，我的审批
- 主持人选择审批的审批人才能查看
- 是否审批
六，会议通知
- 参与者or列席者
- 可反馈：参加or不参加(不参加需说明原因)
七，待开会议
- 会议状态为待开的
八，历史会议
- 会议状态为结束的
九，所有会议
十，用户管理
- 增删改查（重置密码1234）
十一，统计
- 用户统计
- 会议统计
ok! 就分享到这里啦 。
375
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
