OA会议管理系统之会议通知（送审成功可查看人员是否参与会议）（二）-阿里云开发者社区

2.2.jsp页面编写

meetingNotify.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/common/static.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="static/js/meeting/meetingNotify.js"></script>
<title>会议通知</title>
</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" style="margin:15px 0px;">
  <div class="layui-inline">
    <label class="layui-form-label">会议标题</label>
    <div class="layui-input-inline">
      <input type="hidden" id="personId" value="${user.id }"/>
      <input type="text" id="title" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-inline">
    <button id="btn_search" type="button" class="layui-btn"><i class="layui-icon layui-icon-search"></i> 查询</button>
  </div>
</div>
<!-- 数据表格 -->
<table id="tb" lay-filter="tb" class="layui-table" style="margin-top:-15px"></table>
<script type="text/html" id="tbar">
  {{# if(d.result==-1){ }}
  <a class="layui-btn layui-btn-xs" lay-event="edits">是否参会</a>
  {{# } }}
</script>
</body>
</html>

meetingNotify.js

//--------------------------------------------------会议通知------------------------------------------------------
let layer,table,$,form,test;
var row;
layui.use(['layer','table','jquery','form','test'],function(){
  layer=layui.layer,
  table=layui.table,
  form=layui.form,
  test=layui.test,
  $=layui.jquery;
  initTable();
  //查询事件
  $('#btn_search').click(function(){
    query();
  });
});
//初始化数据表格（我的审批）
function initTable(){
  table.render({          //执行渲染
        elem: '#tb',   //指定原始表格元素选择器（推荐id选择器）
        url : 'MeetingFeedBack.action',
    title : '会议通知',
    where : { //设定异步数据接口的额外参数，任意设
      'methodName':'queryMeetingFeedBackByUserId',
          'title':$('#title').val(),
    },
        height: 400,         //自定义高度
        loading: false,      //是否显示加载条（默认 true）
        cols: [[             //设置表头
            {field: 'id', title: '会议编号', width: 90},
            {field: 'title', title: '会议标题', width: 120},
            {field: 'location', title: '会议地点', width: 140},
            {field: 'startTime', title: '开始时间', width: 120,
              templet:function(d){
                return test.toDate(new Date(d.startTime));
              }
            },
            {field: 'endTime', title: '结束时间', width: 120,
              templet:function(d){
                return test.toDate(new Date(d.endTime));
              }
            },
            {field: 'result', title: '反馈状态', width: 120,
              templet: function(d){
                    if(d.result==1)
                      return "参会";
                    else if(d.result==2)
                      return "缺席";
                    else
                      return "未读";
                }
            },
            {field: '', title: '操作', width: 200,toolbar:'#tbar'},
        ]],
    page : true
   });
  //工具条事件
  table.on('tool(tb)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
      row = obj.data; //获得当前行数据
      var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
      var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
    //console.log("反馈"+row);
    //console.log("反馈"+layEvent);
      if(layEvent === 'edits'){ //审批
        openLayer(row.id)
      } 
    });
}
//点击查询
function query(){
  table.reload('tb', {
        url:'MeetingFeedBack.action',     //请求地址
        method: 'POST',                    //请求方式，GET或者POST
        loading: true,                     //是否显示加载条（默认 true）
        page: true,                        //是否分页
        where: {                           //设定异步数据接口的额外参数，任意设
          'methodName':'queryMeetingFeedBackByUserId',
          'title':$('#title').val(),
        },  
        request: {                         //自定义分页请求参数名
            pageName: 'page', //页码的参数名称，默认：page
            limitName: 'rows' //每页数据量的参数名，默认：limit
        },
        done: function (res, curr, count) {
          console.log(res);
        }
   });
}
function openLayer(id){
    layer.open({
        type: 2,                    //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
        title: '会议反馈',                   //对话框标题
        area: ['660px', '400px'],   //宽高
        skin: 'layui-layer-rim',    //样式类名
        content: '../../Layui/jsp/meeting/addFeedBack.jsp?id='+id,                //弹出内容。可以传入普通的html内容，还可以指定DOM，更可以随着type的不同而不同
        btn:['会议反馈','关闭'],
        yes:function(index,layero){
          //layer.msg('保存');
          //调用子页面中提供的getData方法，快速获取子页面的form表单数据
            let data= $(layero).find("iframe")[0].contentWindow.getData();
            addMeetingFeedBack(data);
        },
        btn2:function(){
          layer.closeAll();
        }
    });
}
// 对会议通知进行 参会/不参会的反馈
function addMeetingFeedBack(params){
  params['methodName']="add";
  console.log(params);
  $.post('MeetingFeedBack.action',params,function(rs){
    if(rs.success){
      layer.closeAll();
      query();
    }else{
      layer.msg(rs.msg,{icon:5},function(){});
    }
  },'json');
}

addFeedBack.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
  pageEncoding="UTF-8"%>
<%@ include file="/common/static.jsp"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="static/js/meeting/addFeedBack.js"></script>
<title>反馈页面</title>
</head>
<style>
body {
  margin: 5px;
}
</style>
<body>
  <div style="padding: 10px;">
    <form class="layui-form layui-form-pane" lay-filter="back">
      <!-- <div class="layui-form-item">
        <button type="submit" class="layui-btn" lay-submit="" lay-filter="meeting">立即提交</button>
        <button id="reset" type="reset" class="layui-btn layui-btn-primary">重置</button>
      </div> -->
      <input type="hidden" name="meetingId" value="${param.id }" /> <input
        type="hidden" name="personId" value="${sessionScope.user.id }" />
      <div class="layui-form-item">
        <label class="layui-form-label">人员类型</label>
        <div class="layui-input-block">
          <select id="personType" name="personType">
            <c:if test="${user.rid == 1 || user.rid == 2 || user.rid == 4}">
              <option value="1" selected>参会人员</option>
            </c:if>
            <c:if test="${user.rid == 3 || user.rid == 5}">
              <option value="2" selected>列席人员</option>
            </c:if>
          </select>
        </div>
      </div>
      <div class="layui-form-item">
        <label class="layui-form-label">反馈结果</label>
        <div class="layui-input-block">
          <select id="result" name="result">
            <option value="">请选择反馈结果</option>
            <option value="1">参加</option>
            <option value="2">不参加</option>
          </select>
        </div>
      </div>
      <div class="layui-form-item layui-form-text" id="textareadiv">
        <label class="layui-form-label">如果不参与会议的请填写原因（参会无需填写）</label>
        <div class="layui-input-block">
          <textarea placeholder="请输入内容" name="reason" class="layui-textarea"></textarea>
        </div>
      </div>
    </form>
  </div>
</body>
</html>

addFeedBack.js

//---------会议通知反馈-------------------
let form, $, resultSelect, reasonInput;
layui.use(['form', 'jquery'], function() {
    form = layui.form;
    $ = layui.jquery;
});
function getData() {
  return form.val('back');
}

2.3.Web层编写

MeetingFeedBackAction

package com.xw.web;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import com.xw.biz.IMeetingFeedBackBiz;
import com.xw.biz.MeetingFeedBackBizImpl;
import com.xw.entity.MeetingFeedBack;
import com.xw.entity.User;
import com.zking.framework.ActionSupport;
import com.zking.framework.ModelDriver;
import com.zking.util.PageBean;
import com.zking.util.R;
import com.zking.util.ResponseUtil;
import com.zking.util.StringUtils;
/**会议反馈
 * @author 索隆
 *
 */
public class MeetingFeedBackAction extends ActionSupport implements ModelDriver<MeetingFeedBack>{
  private MeetingFeedBack meetingFeedBack=new MeetingFeedBack();
  private IMeetingFeedBackBiz imbd=new MeetingFeedBackBizImpl();
  /**
   * 初始化会议通知数据
   * 
   * @param req
   * @param resp
   * @throws Exception
   */
  public void queryMeetingFeedBackByUserId(HttpServletRequest req, HttpServletResponse resp) throws Exception {
    // 初始化PageBean
    PageBean pageBean = new PageBean();
    pageBean.setRequest(req);
    // 获取当前登陆的用户id
    HttpSession session = req.getSession();
    User user = (User) session.getAttribute("user");
    if (user != null) {
      meetingFeedBack.setPersonId(user.getId());
    }
    // 初始化数据
    List<Map<String, Object>> list = imbd.list(meetingFeedBack, pageBean);
    // 利用R工具类制造出符合要求的json格式数据
    ResponseUtil.writeJson(resp, R.ok(0, "查询成功", pageBean.getTotal(), list));
  }
  /**
   * 新增反馈信息
   * 
   * @param req
   * @param resp
   * @throws Exception
   */
  public void add(HttpServletRequest req, HttpServletResponse resp) throws Exception {
    // 调用新增的方法
    int n  = imbd.add(meetingFeedBack);
    // 利用R工具类制造出符合要求的json格式数据
    if (n > 0) {
      // 反馈成功
      ResponseUtil.writeJson(resp, R.ok(0, "反馈成功"));
    } else {
      // 反馈失败
      ResponseUtil.writeJson(resp, R.error(1, "反馈失败"));
    }
  }
  /**
   * 反馈信息的数据加载
   * 
   * @param req
   * @param resp
   * @throws Exception
   */
  public void queryMeetingBackByMeetingId(HttpServletRequest req, HttpServletResponse resp) throws Exception {
    // 初始化数据
    List<Map<String, Object>> list = imbd.queryMeetingBackByMeetingId(meetingFeedBack);
    // 利用R工具类制造出符合要求的json格式数据
    ResponseUtil.writeJson(resp, R.ok(0, "查询成功", list));
  }
  @Override
  public MeetingFeedBack getModel() {
    return meetingFeedBack;
  }
}