OA会议管理系统之我的会议(会议排座&可拖拽座位&附源码)(一)

简介: OA会议管理系统之我的会议(会议排座&可拖拽座位&附源码)

0768dfde47ef4ef6883b44c77fddbf02.jpg

一、前言

1.导读

       书接上文,在上一篇中我们完成了会议发布,但是发布就是要召开会议吗?不见得,如果选择的会议场地已经被占用或是会议人员因为某种事情而缺席等等原因应该怎么办?这时候就到了我的会议功能的重要性了,通过发布会议的会议信息会在这里显示,等待发布人员排座和提交上级领导审核通过后,方可正式召开会议。

二、我的会议功能实现

1.功能介绍

先看原型图

首先,引入眼帘的肯定是我们的初始数据,其次才是我们的主要模块的功能会议排座和送审,因为每个场地的不同所以更应该要排座,如果没有排座就不能送审,这是硬性要求,送审人也是用户身份编号为3(审批者)方可显示在我们的下拉框中。

排座效果展示:

明确了开发会议排座的意义

思考如何去完成这个功能?

1.查询出本场会议中的所有参与人员(参会人员、列席人员、主持人)

2.需要完成在页面上元素的拖动功能,把对应的参会人员放在指定位置,

如:重要的人就放在主位

3.将已经画好的会议座位图,保存下来,并且绑定到本次会议数据上去。

2.功能分析

1.寻找插件资料

网上其实有大把的资料,只要功夫深铁杵磨成针。

2.修改插件

但是搜索出来的结果肯定不能达到我们的预期,需要进一步调整。

(调整代码的过程,我这里就不一一附属了,代码会在后面给到大家!!)

3.将插件部署到我们的项目中

修改后的代码肯定又是个新的jsp文件,到时候以iframe的方式嵌入到我们指定的页面即可。

4.将排座好的图片下载

  1. 座位图要写入到xxx盘(可配置-读配置文件)
  2. 修改会议中图片地址
  3. 修改服务器配置,完成图片真实硬盘地址与浏览器请求地址的映射
  4. 在页面上直接显示图片,而并不是图片地址

这里会使用第三方库 html2canvas,将指定元素 screen_body(通过其 ID 获取)的内容转换为 canvas 元素。 然后将 canvas 元素的内容转换为 base64 编码的数据 URL,赋值给指定的变量方便我们取值。

5.初始化人员信息到会议排座中

  1. 获取参会人员的所有id
  2. 拿到id之后查询用户详细信息

3.功能实现

3.1.前期准备

配置我们本地存放图片的位置

resource.properties

dirPath=E:/oa/
serverPath=/upload/paizuo/

温馨提示:

上面是图片本地路径下面的是服务器路径并且要存入数据库的也是下面的路径

配置文件存放的位置与我们配置Action一致

关配置还不行,还需要读取配置文件内容,这里我将这步操作封装成了一个工具类方便我们使用。

PropertiesUtil(读取图片配置工具类)

package com.zking.util;
import java.io.IOException;
import java.io.InputStream;
import java.util.Properties;
public class PropertiesUtil {
  public static String getValue(String key) throws IOException {
    Properties p = new Properties();
    InputStream in = PropertiesUtil.class.getResourceAsStream("/resource.properties");
    p.load(in);
    return p.getProperty(key);
  }
}

引入项目外的资源(tomcat容器方式)

3.2.dao层编写

dao层会涉及到User和Meetinginfo

MeetinginfoDao

初始化我的会议信息和送审人信息以及保存会议排座和送审人的信息修改操作

package com.xw.dao;
import java.sql.SQLException;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.List;
import java.util.Map;
import com.xw.entity.Meetinginfo;
import com.zking.util.BaseDao;
import com.zking.util.PageBean;
import com.zking.util.StringUtils;
/**
 * Meetingroominfo数据访问层接口实现
 * 
 * @author 索隆
 *
 */
public class MeetinginfoDaoImpl extends BaseDao<Meetinginfo> implements IMeetinginfoDao {
  /**
   * 新增会议发布数据
   * 
   * @param minfo
   * @return
   * @throws Exception
   */
  @Override
  public int add(Meetinginfo minfo) throws Exception {
    // sql语句编写
    String sql = "insert into t_oa_meeting_info (title,content,canyuze,liexize,zhuchiren,location,startTime,endTime,remark) values(?,?,?,?,?,?,?,?,?)";
    return super.executeUpdate(sql, minfo, new String[] { "title", "content", "canyuze", "liexize", "zhuchiren",
        "location", "startTime", "endTime", "remark" });
  }
  /**
   * 我的审批数据初始化
   * 
   * @param title
   *            会议标题
   * @param zhuchiren
   *            用户id
   * @return
   * @throws Exception
   */
  @Override
  public List<Map<String, Object>> list(Meetinginfo minfo, PageBean pageBean) throws Exception {
    // sql语句编写
    String sql = "SELECT\r\n" + " a.id,\r\n" + "  a.title,\r\n" + " a.content,\r\n" + " a.canyuze,\r\n"
        + " a.liexize,\r\n" + " a.zhuchiren,\r\n" + " b.NAME,\r\n" + "  d.NAME AS roomName,\r\n"
        + " DATE_FORMAT( a.startTime, '%Y-%m-%d %H:%i:%s' ) AS startTime,\r\n"
        + " DATE_FORMAT( a.endTime, '%Y-%m-%d %H:%i:%s' ) AS endTime,\r\n" + "  a.state,\r\n" + " (\r\n"
        + "CASE\r\n" + "  \r\n" + " WHEN a.state = '1' THEN\r\n" + "  '新建' \r\n"
        + " WHEN a.state = '2' THEN\r\n" + "  '待审核' \r\n" + " WHEN a.state = '3' THEN\r\n" + "  '驳回' \r\n"
        + " WHEN a.state = '4' THEN\r\n" + "  '待开' \r\n" + "  WHEN a.state = '5' THEN\r\n" + "  '进行中' \r\n"
        + " WHEN a.state = '6' THEN\r\n" + "  '开启投票' \r\n" + "  WHEN a.state = '7' THEN\r\n"
        + " '结束会议' ELSE '会议取消' \r\n" + "END \r\n" + " ) AS meetingState,\r\n" + " a.seatPic,\r\n"
        + " a.remark,\r\n" + "  a.auditor,\r\n" + " c.NAME AS auditorName \r\n" + "FROM\r\n"
        + " t_oa_meeting_info a\r\n" + "  INNER JOIN t_oa_user b ON a.zhuchiren = b.id\r\n"
        + " LEFT JOIN t_oa_user c ON a.auditor = c.id\r\n"
        + " LEFT JOIN t_oa_meeting_room d ON d.id = a.location \r\n" + "WHERE\r\n" + "  1 = 1 ";
    // 进行参数非空判断
    String title = minfo.getTitle();// 会议标题
     String auditor = minfo.getAuditor();// 会议状态
    Integer state = minfo.getState();// 会议状态
    // 根据标题查找
    if (StringUtils.isNotBlank(title)) {
      sql += " AND title LIKE '%" + title + "%'";
    }
    // 根据主持人查找
    if (StringUtils.isNotBlank(auditor)) {
      sql += " and auditor = '" + auditor + "'";
    }
    // 根据会议状态查找
    if (state != null) {
      sql += " and state = " + 2;
    }
    // 按照id降序排序
    sql += " ORDER BY a.id DESC";
    return super.executeQuery(sql, pageBean);
  }
  @Override
  public List<Map<String, Object>> Bystatelist(Meetinginfo minfo, PageBean pageBean) throws Exception {
    // sql语句编写
    String sql = "SELECT\r\n" + " a.id,\r\n" + "  a.title,\r\n" + " a.content,\r\n" + " a.canyuze,\r\n"
        + " a.liexize,\r\n" + " a.zhuchiren,\r\n" + " b.NAME,\r\n" + "  d.NAME AS roomName,\r\n"
        + " DATE_FORMAT( a.startTime, '%Y-%m-%d %H:%i:%s' ) AS startTime,\r\n"
        + " DATE_FORMAT( a.endTime, '%Y-%m-%d %H:%i:%s' ) AS endTime,\r\n" + "  a.state,\r\n" + " (\r\n"
        + "CASE\r\n" + "  \r\n" + " WHEN a.state = '1' THEN\r\n" + "  '新建' \r\n"
        + " WHEN a.state = '2' THEN\r\n" + "  '待审核' \r\n" + " WHEN a.state = '3' THEN\r\n" + "  '驳回' \r\n"
        + " WHEN a.state = '4' THEN\r\n" + "  '待开' \r\n" + "  WHEN a.state = '5' THEN\r\n" + "  '进行中' \r\n"
        + " WHEN a.state = '6' THEN\r\n" + "  '开启投票' \r\n" + "  WHEN a.state = '7' THEN\r\n"
        + " '结束会议' ELSE '会议取消' \r\n" + "END \r\n" + " ) AS meetingState,\r\n" + " a.seatPic,\r\n"
        + " a.remark,\r\n" + "  a.auditor,\r\n" + " c.NAME AS auditorName \r\n" + "FROM\r\n"
        + " t_oa_meeting_info a\r\n" + "  INNER JOIN t_oa_user b ON a.zhuchiren = b.id\r\n"
        + " LEFT JOIN t_oa_user c ON a.auditor = c.id\r\n"
        + " LEFT JOIN t_oa_meeting_room d ON d.id = a.location \r\n" + "WHERE\r\n" + "  1 = 1 ";
    // 进行参数非空判断
    String title = minfo.getTitle();// 会议标题
    Integer state = minfo.getState();// 会议状态
    String zhuchiren = minfo.getZhuchiren();// 会议主持人
    // 根据标题查找
    if (StringUtils.isNotBlank(title)) {
      sql += " AND title LIKE '%" + title + "%'";
    }
    // 根据主持人查找
    if (StringUtils.isNotBlank(zhuchiren)) {
      sql += " and zhuchiren = '" + zhuchiren + "'";
    }
    // 根据会议状态查找
    if (state != null&&state!=0) {
      sql += " and state = " + state;
    }
    // 按照id降序排序
    sql += " ORDER BY a.id DESC";
    return super.executeQuery(sql, pageBean);
  }
    @Override
  public int updateSeatPicById(Meetinginfo meetinginfo) throws Exception {
    String sql = "UPDATE  t_oa_meeting_info set seatPic =?  WHERE id=?";
    return super.executeUpdate(sql, meetinginfo, new String[] { "seatPic", "id" });
  }
  @Override
  public int updateAuditorById(Meetinginfo meetinginfo) throws Exception {
    String sql = "UPDATE  t_oa_meeting_info set auditor =?,state=2  WHERE id=?";
    return super.executeUpdate(sql, meetinginfo, new String[] { "auditor", "id" });
  }
}

UserDao

初始化我的会议排座人员信息

package com.xw.dao;
import java.util.List;
import java.util.Map;
import com.xw.entity.User;
import com.zking.util.BaseDao;
import com.zking.util.PageBean;
import com.zking.util.StringUtils;
/**
 * 用户
 * 
 * @author 索隆
 *
 */
public class UserDao extends BaseDao<User> {
  //会议排座的人员信息绑定
  public List<User> queryUserByMeetingId(Integer valueOf) throws Exception {
    String sql="select * from t_oa_user where FIND_IN_SET(id,(select CONCAT(canyuze,',',liexize,',',zhuchiren) from t_oa_meeting_info where id="+valueOf+" ))";
    return super.executeQuery(sql,User.class, null);
  }
}

相关文章
|
1天前
|
NoSQL 前端开发 Java
基于springboot实现OA办公管理系统
基于springboot实现OA办公管理系统
基于springboot实现OA办公管理系统
|
1天前
|
SQL 存储 JavaScript
Layui之OA会议增删改查
Layui之OA会议增删改查
39 0
|
5月前
|
开发框架 JavaScript 前端开发
J2EE项目部署与发布(Windows版本)->会议OA单体项目Windows部署,spa前后端分离项目Windows部署
J2EE项目部署与发布(Windows版本)->会议OA单体项目Windows部署,spa前后端分离项目Windows部署
32 0
|
5月前
会议OA项目-其它页面->自定义组件应用,其它界面的布局
会议OA项目-其它页面->自定义组件应用,其它界面的布局
26 0
|
5月前
|
容器
会议OA项目-首页->flex弹性布局,轮播图后台数据获取及组件使用(后台数据交互mockjs),首页布局
会议OA项目-首页->flex弹性布局,轮播图后台数据获取及组件使用(后台数据交互mockjs),首页布局
37 0
|
5月前
|
JSON 小程序 前端开发
小程序之自定义组件 结合案例(会议OA的会议/投票管理及个人中心的搭建)详解 (4)
小程序之自定义组件 结合案例(会议OA的会议/投票管理及个人中心的搭建)详解 (4)
|
5月前
|
JSON 小程序 前端开发
小程序之实例会议OA的首页 (3)
小程序之实例会议OA的首页 (3)
|
5月前
|
BI 数据安全/隐私保护 UED
以产品经理的角度去讲解原型图---会议OA项目
以产品经理的角度去讲解原型图---会议OA项目
|
5月前
|
JSON 小程序 JavaScript
微信小程序开发的OA会议之会议,个人中心的页面搭建及模板以及自定义组件
微信小程序开发的OA会议之会议,个人中心的页面搭建及模板以及自定义组件
45 0
|
5月前
|
JSON 小程序 前端开发
微信小程序----会议oa项目---首页
微信小程序----会议oa项目---首页
37 0