layui之所有会议以及待开会议模块

简介: layui之所有会议以及待开会议模块

前言


这是会议oa管理系统的会议管理模块的最后一个小模块了,今天我们就来讲解一下所有会议以及待开会议的功能实现,只有简单的查询,比起前面的会议反馈简单多了


功能演示


360382a8d33745418ed7f9a53aba2351.gif


sql分析


待开会议sql

SELECT a.id,a.title,a.content,a.canyuze,a.liexize,a.zhuchiren,b.`name`,a.location
,DATE_FORMAT(a.startTime,'%Y-%m-%d %H:%i:%s') as startTime
,DATE_FORMAT(a.endTime,'%Y-%m-%d %H:%i:%s') as endTime
,a.state
,(case a.state
when 0 then '取消会议'
when 1 then '新建'
when 2 then '待审核'
when 3 then '驳回'
when 4 then '待开'
when 5 then '进行中'
when 6 then '开启投票'
else '结束会' end
) as meetingState
,a.seatPic,a.remark,a.auditor,c.`name` as auditorName
FROM t_oa_meeting_info a
inner join t_oa_user b on a.zhuchiren = b.id
left JOIN t_oa_user c on a.auditor = c.id where 1=1 and FIND_IN_SET('6',CONCAT(a.canyuze,',',a.liexize,',',a.zhuchiren))  and title like '%%' and state = 4 order by a.id desc

当前登录账号,只要是 某会议 的参与者、列席者、主持人中的一员,并且会议状态是待开,则查询出来


所有会议

当前登录账号,只要是 某会议 的参与者、列席者、主持人中的一员,,则查询出来

-- 只是新建状态,还没有对应审核人也应该查询出来
SELECT CONCAT(a.canyuze,',',a.liexize,',',a.zhuchiren,',',IFNULL(a.auditor,-1)) allPerson
,a.id,a.title,a.content,a.canyuze,a.liexize,a.zhuchiren,b.`name`,a.location
,DATE_FORMAT(a.startTime,'%Y-%m-%d %H:%i:%s') as startTime
,DATE_FORMAT(a.endTime,'%Y-%m-%d %H:%i:%s') as endTime
,a.state
,(case a.state
when 0 then '取消会议'
when 1 then '新建'
when 2 then '待审核'
when 3 then '驳回'
when 4 then '待开'
when 5 then '进行中'
when 6 then '开启投票'
else '结束会' end
) as meetingState
,a.seatPic,a.remark,a.auditor,c.`name` as auditorName
FROM t_oa_meeting_info a
inner join t_oa_user b on a.zhuchiren = b.id
left JOIN t_oa_user c on a.auditor = c.id where 1=1 and FIND_IN_SET('2',CONCAT(a.canyuze,',',a.liexize,',',a.zhuchiren,',',IFNULL(a.auditor,-1)))  and title like '%%' order by a.id desc

大家其实可以发现,这两者的sql语句都差不多,是的,只是会议的状态不同,待开会议只需要查询会议状态是待开的就好了


源码展示

所有会议jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="/common/public.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath }/static/js/meeting/meetingAll.js"></script>
</head>
<style>
body{
  margin:15px;
}
.layui-table-cell {height: inherit;}
.layui-layer-page .layui-layer-content {  overflow: visible !important;}
</style>
<body>
  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">会议标题:</label>
      <div class="layui-input-inline">
        <input type="hidden" id="userid" value="${sessionScope.user.id }"/>
        <input type="text" id="title" autocomplete="off"
          class="layui-input">
      </div>
    </div>
    <div class="layui-inline">
      <button id="btn_meeting_search" class="layui-btn ">
        <i class="layui-icon">&#xe615;</i> 查询
      </button>
    </div>
  </div>
  <table style="margin-top: -15px;" id="tb_meeting" lay-filter="tb_meeting"></table>
</body>
</html>


所有会议js

let layer,form,table,$;
var row;
layui.use(['layer','form','table'],function(){
    layer=layui.layer,form=layui.form,table=layui.table,$=layui.jquery;
    //初始化会议列表
    initMeeting();
    query();
    //绑定查询按钮的点击事件
    $('#btn_meeting_search').click(function(){
        query();
    });
});
//1.初始化会议列表
function initMeeting(){
    table.render({           //执行渲染
        elem: '#tb_meeting',   //指定原始表格元素选择器(推荐id选择器)
        height: 400,         //自定义高度
        loading: false,      //是否显示加载条(默认 true)
        cols: [[             //设置表头
            {field: 'title', title: '会议标题', width: 180},
            {field: 'location', title: '会议地点', width: 120},
            {field: 'startTime', title: '开始时间', width: 180},
            {field: 'endTime', title: '结束时间', width: 180},
            {field: 'meetingState', title: '会议状态', width: 90},
            {field: 'name', title: '主持人', width: 120},
            //{field: '', title: '操作', width: 260, toolbar: '#tbMeeting'}
        ]]
    });
}
//2.查询所有会议
function query(){
    table.reload('tb_meeting', {
        url: 'info.action',     //请求地址
        method: 'POST',                    //请求方式,GET或者POST
        loading: true,                     //是否显示加载条(默认 true)
        page: true,                        //是否分页
        where: {                           //设定异步数据接口的额外参数,任意设
            'methodName':'allInfos',
            'title':$('#title').val(),
            'zhuchiren':$('#userid').val()
        },
        request: {                         //自定义分页请求参数名
            pageName: 'page', //页码的参数名称,默认:page
            limitName: 'rows' //每页数据量的参数名,默认:limit
        },
        done: function (res, curr, count) {
            //查询完成的回调函数
        }
    });
}


待开会议jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="/common/public.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath }/static/js/meeting/meetingWaiting.js"></script>
</head>
<style>
body{
  margin:15px;
}
.layui-table-cell {height: inherit;}
.layui-layer-page .layui-layer-content {  overflow: visible !important;}
</style>
<body>
  <div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">会议标题:</label>
      <div class="layui-input-inline">
        <input type="hidden" id="userid" value="${sessionScope.user.id }"/>
        <input type="text" id="title" autocomplete="off"
          class="layui-input">
      </div>
    </div>
    <div class="layui-inline">
      <button id="btn_meeting_search" class="layui-btn ">
        <i class="layui-icon">&#xe615;</i> 查询
      </button>
    </div>
  </div>
  <table style="margin-top: -15px;" id="tb_meeting" lay-filter="tb_meeting"></table>
</body>
</html>


待开会议js

let layer,form,table,$;
var row;
layui.use(['layer','form','table'],function(){
    layer=layui.layer,form=layui.form,table=layui.table,$=layui.jquery;
    //初始化会议列表
    initMeeting();
    query();
    //绑定查询按钮的点击事件
    $('#btn_meeting_search').click(function(){
        query();
    });
});
//1.初始化会议列表
function initMeeting(){
    table.render({           //执行渲染
        elem: '#tb_meeting',   //指定原始表格元素选择器(推荐id选择器)
        height: 400,         //自定义高度
        loading: false,      //是否显示加载条(默认 true)
        cols: [[             //设置表头
            {field: 'title', title: '会议标题', width: 180},
            {field: 'location', title: '会议地点', width: 120},
            {field: 'startTime', title: '开始时间', width: 180},
            {field: 'endTime', title: '结束时间', width: 180},
            {field: 'meetingState', title: '会议状态', width: 90},
            {field: 'name', title: '主持人', width: 120},
            //{field: '', title: '操作', width: 260, toolbar: '#tbMeeting'}
        ]]
    });
}
//2.待开会议
function query(){
    table.reload('tb_meeting', {
        url: 'info.action',     //请求地址
        method: 'POST',                    //请求方式,GET或者POST
        loading: true,                     //是否显示加载条(默认 true)
        page: true,                        //是否分页
        where: {                           //设定异步数据接口的额外参数,任意设
            'methodName':'queryMeetingInfoByState',
            'title':$('#title').val(),
            'zhuchiren':$('#userid').val(),
            'state':4
        },
        request: {                         //自定义分页请求参数名
            pageName: 'page', //页码的参数名称,默认:page
            limitName: 'rows' //每页数据量的参数名,默认:limit
        },
        done: function (res, curr, count) {
            //查询完成的回调函数
        }
    });
}


目录
相关文章
|
存储 JavaScript 前端开发
会议OA项目之会议发布(详解)
会议OA项目之会议发布(详解)
94 0
OA项目之我的会议(查询&会议排座&送审)(一)
OA项目之我的会议(查询&会议排座&送审)
OA会议管理系统之我的会议(会议排座&可拖拽座位&附源码)(三)
OA会议管理系统之我的会议(会议排座&可拖拽座位&附源码)(三)
48 0
|
SQL JavaScript 前端开发
我的会议(我的审批,会议签字附源码)
我的会议(我的审批,会议签字附源码)
98 1
|
JSON 小程序 前端开发
小程序之自定义组件 结合案例(会议OA的会议/投票管理及个人中心的搭建)详解 (4)
小程序之自定义组件 结合案例(会议OA的会议/投票管理及个人中心的搭建)详解 (4)
|
SQL 前端开发 Java
LayUI--会议发布功能
LayUI--会议发布功能
60 0
|
SQL 存储 JavaScript
会议OA系统会议管理模块开发思路(layui搭建)
会议OA系统会议管理模块开发思路(layui搭建)
105 0
|
SQL 前端开发 JavaScript
会议OA之我的会议(会议排座&送审)
会议OA之我的会议(会议排座&送审)
131 0
|
前端开发 JavaScript 关系型数据库
会议OA项目之会议发布(一)
会议OA项目之会议发布(一)
59 0
|
JSON 小程序 JavaScript
会议OA小程序【会议管理,个人中心页面布局】
会议OA小程序【会议管理,个人中心页面布局】