当前位置: 首页 > article >正文

如何使用ssm实现影院管理系统的设计与实现

@TOC

ssm751影院管理系统的设计与实现+jsp

研究背景与现状

时代的进步使人们的生活实现了部分自动化,由最初的全手动办公已转向手动+自动相结合的方式。比如各种办公系统、智能电子电器的出现,都为人们生活的享受提供帮助。采用新型的自动化方式可以减少手动的办公时间,增加正确率从而增加人们的幸福指数。时代进步中计算机技术的发展尤为突出,渗透进生活的方方面面,各种App、 网站、管理系统、小程序迅速占领市场。

对于电影票的购买问题,大多数用户采用在代购点、电影院、三方网站。实地购买电影票需要大量时间,想要预购电影票还得提前去电影院购买。三方网站需要电影院付出中介费用。现实影院售票与管理缺少一种更为优质、简单的方法途径。

1.2课题实现目的和研究意义

时代的发展也为人们提出了更高的要求,只有不断的学习和发展才可以前进。目前我们正在科技和网络发展的关键点,网络已实现普及。然而还是有大量的企业、机构采用传统的办公方式进行处理事务,当然传统的方式对于小规模的企业、机构来说更为适合,但想要发展就需要以发展的目光来看待问题。如果可以采用更科学、省力的方式进行办公将会带来变革。

电影票的购买方式关系着用户购票效率。相关单位对电影票的准确性要严格把关,更要考虑到兑票的方便。以往都是由用户提供电影、场次来购买电影票,用户占主导地位,工作人员负责查询信息然后出票。信息传递有时候会不准确,造成购票的麻烦。如果采用共享的平台,把用户、管理员都结合到一起,起到信息共享就可以解决这类问题。电影的所有信息都可以由管理员直接管理,用户的购票过程也可由相关管理员负责把控,把用户的购票实现流程化、清晰化,减少恶意操作,提供更为透明的工作流程,实现在线电影票购买系统的真正价值。

1.3课题研究内容

  本系统从在线电影票购买的工作出发,包括管理员和用户两种权限。管理员的功能为电影管理、影院管理、电影评价管理、用户管理、订单管理和个人资料管理,实现系统里用户的全面管控,用户可以在线选择需要的电影进行在线选座和购票。两种权限的用户功能相辅相成,不可缺少,共同帮助在线电影票购买工作。

1.4论文结构安排

本篇论文的结构分为摘要、目录、正文部分、总结、致谢和参考文献。正文部分为核心。正文部分分为:

第1章绪论,从课题的开发背景、现状、目的意义等进行本课题的介绍;

第2章系统分析,从系统的开发技术、环境、可行性、操作流程等进行系统的详细分析;

第3章系统设计,从系统的功能图、数据库设计、ER图、数据库表进行系统的设计;

第4章系统实现,主要介绍系统的实现界面和实现内容;

第5章系统测试,讲解主要功能的测试过程以及测试结果。

第2章 系统分析

2.1系统开发中使用相关技术介绍

2.1.1Java介绍

Java语言是从C++进行衍生出来的一种新型编程语言,他保留了C++语言中很多核心技术,继承了他的面向对象的优点,而且舍弃了很多缺点,比如在Java语言中去掉了指针,这样可以减少很多错误,还去掉了运算符,这样提高了运行处理效率。还增加了很多优点,添加了垃圾回收功能,提高了代码的使用率,总体来说,Java语言是一个分布式的、高性能的、多线程的开发语言。Java从开发之初就是打算作为一个开放性的语言技术,这就要求需要有很高的兼容性,首先就需要同样的代码程序可以在不同的计算机上运行,还要支持不同的网络,同时还要注重安全性,方便用户使用。Java语言最突出的特点就是面向对象,可以把一个对象当成很多代码状态的物体,然后进行自定义类型进行关联操作,这样进行集合起来的代码就叫对象,面向对象的方法可以使设计根据的简单,方便管理,还可以减少失败。C++最大的一个缺点就是没有垃圾回收机制,通常在编程的过程中,初始化对象时候系统会自动分配一个内存地址,如果不需要这个对象的时候,系统不能进行自动删除和回收,这样造成了很大的内存浪费,导致系统卡顿,会让系统非常的不稳定,严重的话甚至会系统崩溃,而Java语言就是在这个基础上设置了垃圾回收机制,当一个使用过的对象没有引用的时候,系统可以自动删除,回收内存,这样就可以很好的避免了内存泄漏,保障了程序的安全,同时提高了运行效率。

2.1.2MySQL数据库介绍

MySQL数据库是目前比较流行的一种开源数据库,可以支持多种编译器进行在线测试,从而保证了代码的可移植性,而且支持多种操作系统有很好的跨平台性,为编程语言提供所需要的API,可以多线程同时运行,这样有效的减少了内存占用率,提高了使用效率。运行的过程中还能自动优化sql查询算法,这样使数据查询速度达到了显著的提高,而且MySQL数据库还可以作为一个独立的程序在客户端中单独使用,也可以嵌入到其他程序中搭配一起使用。MySQL数据库效率非常的高,可以处理上千万条数据,可以同时支持多种不同的数据引擎,而且是开源的软件,不需要支付任何费用,而且可以进行定制,使用GPL协议进行代码修改,开发属于自己的MySQL系统。综上所述,MySQL数据库是一个非常受欢迎的一个数据库,体积小,速度快,最重要的还是免费,非常适合中小型项目的开发使用。

2.1.3B/s架构介绍

B/s架构是随着网络快速发展而开发出来的一种网络框架,跟传统的c/s框架最大的区别就是,直接把代码部署到网络服务器中,这样方便了系统的后期开发和维护,然后用户可以直接通过浏览器进行代码的访问,不需要额外安装任何的软件客户端,简化了用户的使用。B/s结构是指Browser/Server结构,意思就是只需要安装一个服务器就行了, 客户端方面主要就是采用浏览器进行访问,主要是对传统的c/s架构的一种改进,采用www浏览器技术和其他Script语言技术,把系统实现需要的代码全部部署到了服务器上面,是一种新型的架构技术,可以直接借助浏览器进行数据访问和数据交互。最大的优点就是,不需要安装客户端,不受环境影响,可以实时实地的进行访问,其次就是维护非常的方便。当然了有优点也有不可避免的缺点,首先是在访问速度方面,比较受网络的影响,不像cs架构一样,处理速度非常的快,直接在本机就可以完成数据交互,而B/s需要借助网络才能进行服务器访问,必须保证有顺畅的网络,才能有好的使用体验,其次就是安全性,因为所有数据存储在网络服务器中,比较容易受到攻击,从而造成数据泄漏,这是目前B/s架构存在的最大的弊端。所以说B/s架构适合一些电子商务类的网站,适合比较有用户共享交互的,开放性的网站的设计与开发。所以我开发本系统采用B/s架构是非常适合的,可以达到多人同时登录系统,可以实现信息交互,而且方便随时随地的进行数据访问,而且本人对B/s架构开发比较熟悉,所以本系统就采用B/s架构来进行开发设计。

2.1.4 Tomcat服务器介绍

Tomcat服务器属于Apache服务器的一部分。Tomcat服务器作为Java语言项目的运行条件非常受欢迎。因为Tomcat服务器非常小,可以内置到运行软件里使用,不需要单独安装,这样可以减少多种环境的安装,从而简化项目的调试。Tomcat服务器由SUN公司创立,可以处理Html页面,在运行中处理Jsp和Servlet页面。

2.1.5Jsp技术介绍

Jsp技术是一种用来创建动态页面的技术。Jsp技术通过服务器来响应要求,再根据要求生成Html、Xml来进行转换成Web页面。Jsp技术也属于一种脚本语言,常用来搭配Java语言使用,可以和静态的页面一起使用,把静态的页面改成动态的页面。Jsp技术在使用时可以转换成Servlet代码,然后再编译成二进制的机器码,当然也可以直接编译成二进制的机器码。Jsp技术的特点为简单好用,可以快速的把静态页面变成动态的页面,它使用Java来把常用的代码来复制,可以减少编程人员的重复工作,同时Jsp技术还拥有很多标签,可以支持更多的外在标签和内在的标签,还可以自定义标签,使编程人员在使用时更加的灵活,加快项目开发的速度。Jsp技术的功能非常简单,只负责页面数据,负责页面的传输,所以更加的单纯,不容易出错。

2.2系统可行性分析

系统的可行性关系着系统开发的成功和市场,没有经过详细可行性分析的系统开发过程会非常艰难。系统的可行性分析也是在系统开发前的必要研究过程。通过研究已有的大量论文和文献发现,系统可行性从系统的经济方面、操作方面和技术方面进行分析。

2.2.1经济可行性分析

系统开发所需要的经济主要在系统的成本问题、运行问题和维护问题上。本系统在开发中不需要经济的支撑,所需要的开发软件和设备都是在已有条件上。本系统在运行里所需要的环境也都为免费就可以下载的。本系统在后期的维护上也只需要技术支持就可以完成。所以本系统在经济可行性上可以通过。

2.2.2操作可行性分析

本系统在开发中充分调查了所使用用户的操作习惯和风格,所有的操作流程也都为简单的流程,在操作中也设置了提醒。用户在使用本系统时只要按照提示就可以完成,非常简单。所以本系统在操作可行性上可以通过。

2.2.3技术可行性分析

本系统所需要的技术支持为Java语言,MySQL数据库,Jsp技术和SSM框架等。所使用的技术都为开源成熟的技术,也是目前流行的技术之一。使用这些技术开发的系统可以保证系统的前詹性和稳定性、安全性。所以本系统在技术可性性上可以通过。

2.3系统需求分析

目前计算机、网络技术已进入到各行各业。电影院做为娱乐的重要组成部分更应身体力行,电影票购买里的所有工作都是围绕电影而展开,每场电影的电影档案信息都非常多,如果采用传统的管理方式非常容易造成混乱,而且对于电影的信息查询非常不便。对于电影的管理工作需要额外的严谨,如果还是采用传统的电影管理方式对电影场次、使用用户都做不到百分百的监管,工作步骤、内容也实现不了透明。所以非常需要新的管理方式出现。

2.4系统性能分析

系统在设计时也需要注意系统的性能,一般系统的性能方面包括系统的稳定性、安全性、界面设计方面、操作方面、协调等方面。

  1. 本系统在界面设计方面尊重所有的使用权限,多方面参考不同使用权限的使用习惯以及风格,综合不同的情况整理出符合大众要求的系统界面。做到自己的最大能力;
  2. 在系统的稳定性、安全性方面采用必要的登录验证,不同权限采用不同的账号和密码。为了使系统更为稳定采用成熟的开发环境和技术,在代码编写时尽可能的减少冗余,保证系统的运行效率;
  3. 在系统的操作流程方面,尽可能的采用简单的流程来实现用户要求的反馈,当用户提出需求时,可以用最少的步骤进行提问操作;
  4. 本系统采用数据库和功能界面分开设计,这样可以保证当系统的功能运行出错时不会影响系统里的数据,也就保证了数据的安全。

2.5系统功能分析

系统的功能分析决定了系统的功能设计,完整详细的系统功能分析可以使系统的开发事半功倍。本系统的功能围绕用户、管理员两种权限设计。根据不同权限的不同需求设计出更符合用户要求的功能。本系统中管理员主要负责审核管理注册用户,发布分享新的电影,审核用户的购票信息和进行影院、电影类型管理,用户可以对需要的电影进行选座、购票等。管理个人资料、查询电影、在线购票、管理订单等,用户的个人资料是由用户注册时产生,用户的订单内容由用户在购买电影票时产生,用户评价内容由用户在评价电影操作时产生。本影院管理系统的用例图如下图2-1所示:

图2-1系统用例图

2.6系统操作流程分析

  信息从如何产生到反馈结果的过程可以称为信息的流程。分析好系统的操作流程才可以使系统正确运行不会出现Bug。本系统的流程为管理员先进行登录,登录后管理注册用户的账号、密码等信息,更新电影,管理用户的订票信息和公告信息等,用户可以查询电影、在线选座和购票等。系统里展示的电影数据都是由管理员负责。本影院管理系统的操作流程如下图2-2所示:

图2-2影院管理系统操作流程图

第3章 系统设计

3.1系统功能结构设计

系统的功能结构是采用树形图来绘制功能设计。根据分析所得,本系统的功能设计为管理员、用户两部分。管理员为电影管理、公告管理、订单管理、电影类型管理、用户管理、个人中心管理等,用户的功能为查询电影,在线选座、购票、管理个人信息等。用户可以注册进行登录。本影院管理系统的功能结构设计图如下图3-1所示:

图3-1影院管理系统功能结构图

3.2数据库设计

数据库为数据的仓库,决定了数据的保存和修改、删除、调用等。数据库的稳定决定了系统里数据的安全。为了保证数据的查询效率,在建立数据库时需要按照一定的规则。数据不单指文本类型的,也包括音乐、图片甚至是声音都可以称为数据。为了使数据库更加安全,在建立数据库时就需要使用正规的数据库管理系统和在设置权限时需要设置严格的角色分权,更要阻止一切外部端口的探测形为。

本系统采用MySQL数据库,在建立数据库时采用Root用户名。数据库的建立过程为先进行数据的ER图设计然后进行数据库表的实现。

3.2.1数据ER图设计

数据ER图中记录了关系、实体、属性。实体与实体的关系决定了数据在调用时的正确与否,实体的属性决定了该实体的内容。数据ER图的设计同样重要,也是数据库建立的基础。

通过系统中的功能数据分析,本系统的实体主要有电影、管理员、用户、订单等。

  1. 管理员的ER图中的属性有账号、密码、权限。管理员ER图如下图3-2所示:

图3-2管理员ER图

  1. 用户的ER图里的属性有性别、姓名、编号等,用户的ER图如下图3-3所示:

图3-3用户ER图

  1. 电影的ER图里的属性有电影编号、价格、主演、图片等,电影的ER图如下图3-4所示:

图3-4电影ER图

(4)订单的ER图里的属性有订单人、编号、订单时间、电影等,订单ER图如下图3-5所示:

图3-5订单ER图

3.2.2数据库表设计

数据库表是把ER图进行详细化、实体化。不同的表名下保存着相对应的表信息数据。在数据库表里记录着数据的主键、外键、数据类型、长度等。本影院管理系统所创建的数据库表有用户信息表、电影信息表、订单信息表、公告信息表等。本影院管理系统的数据库表如下表3-1—3-11所示:

表3-1 config

表3-2 dianyingleixing

表3-3 dianyingxinxi

表3-4 discussdianyingxinxi

表3-5 news

表3-6 orders

表3-7 storeup

表3-8 token

表3-9 users

表3-10 yingyuanxinxi

表3-11 yonghu

第4章 系统详细实现

4.1用户登录功能的详细实现

用户登录界面起到验证身份的作用,本界面采用紫色背景进行设计。在用户登录界面里设置了程序的名称和用户、密码的文本框。在文本框下是用户登录、注册用户两个按钮。用户在信息输入完成后可以使用相关按钮进行相对应的操作。用户登录功能的实现界面如下图4-1所示:

图4-1用户登录实现界面

4.2管理员权限的功能实现

4.2.1用户信息管理功能的详细实现

管理员负责用户信息的审核和管理,用户的账号和密码都可以由管理员在此功能里看到。管理员查询用户信息的功能实现如下图4-2所示:

图4-2管理员查询用户信息的实现界面

4.2.2电影管理功能的详细实现

管理员可以对电影的信息进行发布和修改、删除。本功能可以实现电影的定时更新和审核管理。管理员添加电影信息的实现界面如下图4-3所示:

图4-3管理员添加电影信息的实现界面

4.2.3影院管理功能的详细实现

本功能包括对影院信息的更新、设置。可以添加、查询影院信息。影院管理功能的实现详情如下图4-4所示:

图4-4影院管理功能的实现界面

4.2.4电影评价管理功能的详细实现

管理员可以查看电影的评价信息,做好评价收集可以更好的安排电影。电影评价功能的实现界面如下图4-5所示:

图4-5电影评价信息的实现界面

4.2.5电影订单管理功能的详细实现

管理员可以管理用户的订单,用户是否付款也可以在该功能里看到。电影订单管理功能的实现界面如下图4-6所示:

图4-6电影订单管理功能的实现界面

4.2.6个人中心管理功能的详细实现

管理员可以对个人的资料进行修改和管理,管理员还可以在本功能里修改密码。管理员添加管理员账号的实现界面如下图4-7所示:

图4-7添加管理员账号功能的实现界面

4.2.7公告管理功能的实现界面

管理员可以发布公告和实现公告的编辑、删除。管理员查询公告信息的实现界面如下图4-8所示:

图4-8查询公告信息的实现界面

4.2.8电影类型管理功能的实现界面

管理员可以添加类型和设置电影的类型。添加新类型信息的实现界面如下图4-9所示:

图4-9添加新类型信息的界面

4.3用户权限的功能详细实现

4.3.1电影查询功能的详细实现

用户可以根据电影的发布时间查询电影信息。用户查询电影的界面实现如下图4-10所示:

图4-10电影查询功能的运行界面

4.3.2在线选座功能的详细实现

用户在想要购买电影票时可以选择自己想坐的座位,已选择的座位以红色表示,未选择的座位以灰色表示。在线选座功能的实现界面如下图4-11所示:

图4-11在线选座功能的实现界面

4.3.3我的订单管理功能的详细实现

选座完成后可以进行订单支付和管理。我的订单管理功能的实现界面如下图4-12所示:

图4-12我的订单管理功能的运行界面

4.3.4用户注册功能的详细实现

非用户可以在注册功能里实现成为用户。在注册界面里按照要求填写信息就可以完成。用户注册的实现界面如下图4-13所示:

图4-13用户注册功能的运行界面

第5章 系统测试

系统测试的方

OrdersController.java
package com.controller;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;

import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;

import com.entity.OrdersEntity;
import com.entity.view.OrdersView;

import com.service.OrdersService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
import java.io.IOException;

/**
 * 订单
 * 后端接口
 * @author 
 * @email 
 * @date 2022-04-14 17:50:57
 */
@RestController
@RequestMapping("/orders")
public class OrdersController {
    @Autowired
    private OrdersService ordersService;



    


    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,OrdersEntity orders, 
		HttpServletRequest request){
    	if(!request.getSession().getAttribute("role").toString().equals("管理员")) {
    		orders.setUserid((Long)request.getSession().getAttribute("userId"));
    	}

        EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();
    	PageUtils page = ordersService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, orders), params), params));
		request.setAttribute("data", page);
        return R.ok().put("data", page);
    }
    
    /**
     * 前端列表
     */
	@IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,OrdersEntity orders, 
		HttpServletRequest request){
        EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();
    	PageUtils page = ordersService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, orders), params), params));
		request.setAttribute("data", page);
        return R.ok().put("data", page);
    }

	/**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( OrdersEntity orders){
       	EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();
      	ew.allEq(MPUtil.allEQMapPre( orders, "orders")); 
        return R.ok().put("data", ordersService.selectListView(ew));
    }

	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(OrdersEntity orders){
        EntityWrapper< OrdersEntity> ew = new EntityWrapper< OrdersEntity>();
 		ew.allEq(MPUtil.allEQMapPre( orders, "orders")); 
		OrdersView ordersView =  ordersService.selectView(ew);
		return R.ok("查询订单成功").put("data", ordersView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        OrdersEntity orders = ordersService.selectById(id);
        return R.ok().put("data", orders);
    }

    /**
     * 前端详情
     */
	@IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        OrdersEntity orders = ordersService.selectById(id);
        return R.ok().put("data", orders);
    }
    



    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody OrdersEntity orders, HttpServletRequest request){
    	orders.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(orders);
    	orders.setUserid((Long)request.getSession().getAttribute("userId"));

        ordersService.insert(orders);
        return R.ok();
    }
    
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody OrdersEntity orders, HttpServletRequest request){
    	orders.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(orders);

        ordersService.insert(orders);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody OrdersEntity orders, HttpServletRequest request){
        //ValidatorUtils.validateEntity(orders);
        ordersService.updateById(orders);//全部更新
        return R.ok();
    }
    

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        ordersService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
    /**
     * 提醒接口
     */
	@RequestMapping("/remind/{columnName}/{type}")
	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
		map.put("column", columnName);
		map.put("type", type);
		
		if(type.equals("2")) {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Calendar c = Calendar.getInstance();
			Date remindStartDate = null;
			Date remindEndDate = null;
			if(map.get("remindstart")!=null) {
				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
				c.setTime(new Date()); 
				c.add(Calendar.DAY_OF_MONTH,remindStart);
				remindStartDate = c.getTime();
				map.put("remindstart", sdf.format(remindStartDate));
			}
			if(map.get("remindend")!=null) {
				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
				c.setTime(new Date());
				c.add(Calendar.DAY_OF_MONTH,remindEnd);
				remindEndDate = c.getTime();
				map.put("remindend", sdf.format(remindEndDate));
			}
		}
		
		Wrapper<OrdersEntity> wrapper = new EntityWrapper<OrdersEntity>();
		if(map.get("remindstart")!=null) {
			wrapper.ge(columnName, map.get("remindstart"));
		}
		if(map.get("remindend")!=null) {
			wrapper.le(columnName, map.get("remindend"));
		}
		if(!request.getSession().getAttribute("role").toString().equals("管理员")) {
    		wrapper.eq("userid", (Long)request.getSession().getAttribute("userId"));
    	}


		int count = ordersService.selectCount(wrapper);
		return R.ok().put("count", count);
	}
	
	





    /**
     * (按值统计)
     */
    @RequestMapping("/value/{xColumnName}/{yColumnName}")
    public R value(@PathVariable("yColumnName") String yColumnName, @PathVariable("xColumnName") String xColumnName,HttpServletRequest request) {
        Map<String, Object> params = new HashMap<String, Object>();
        params.put("xColumn", xColumnName);
        params.put("yColumn", yColumnName);
        EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();
            ew.in("status", new String[]{"已支付","已发货","已完成"});
        List<Map<String, Object>> result = ordersService.selectValue(params, ew);
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
        for(Map<String, Object> m : result) {
            for(String k : m.keySet()) {
                if(m.get(k) instanceof Date) {
                    m.put(k, sdf.format((Date)m.get(k)));
                }
            }
        }
        return R.ok().put("data", result);
    }

    /**
     * (按值统计)时间统计类型
     */
    @RequestMapping("/value/{xColumnName}/{yColumnName}/{timeStatType}")
    public R valueDay(@PathVariable("yColumnName") String yColumnName, @PathVariable("xColumnName") String xColumnName, @PathVariable("timeStatType") String timeStatType,HttpServletRequest request) {
        Map<String, Object> params = new HashMap<String, Object>();
        params.put("xColumn", xColumnName);
        params.put("yColumn", yColumnName);
        params.put("timeStatType", timeStatType);
        EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();
            ew.in("status", new String[]{"已支付","已发货","已完成"});
        List<Map<String, Object>> result = ordersService.selectTimeStatValue(params, ew);
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
        for(Map<String, Object> m : result) {
            for(String k : m.keySet()) {
                if(m.get(k) instanceof Date) {
                    m.put(k, sdf.format((Date)m.get(k)));
                }
            }
        }
        return R.ok().put("data", result);
    }
    
    /**
     * 分组统计
     */
    @RequestMapping("/group/{columnName}")
    public R group(@PathVariable("columnName") String columnName,HttpServletRequest request) {
        Map<String, Object> params = new HashMap<String, Object>();
        params.put("column", columnName);
        EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();
            ew.in("status", new String[]{"已支付","已发货","已完成"});
        List<Map<String, Object>> result = ordersService.selectGroup(params, ew);
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
        for(Map<String, Object> m : result) {
            for(String k : m.keySet()) {
                if(m.get(k) instanceof Date) {
                    m.put(k, sdf.format((Date)m.get(k)));
                }
            }
        }
        return R.ok().put("data", result);
    }
}

BaiduUtil.java
package com.utils;

import java.io.BufferedReader;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.json.JSONObject;


/**
* 类说明 : 
*/

public class BaiduUtil {
	
    /**
     * 根据经纬度获得省市区信息
     * @param lon 纬度
     * @param lat 经度
     * @param coordtype 经纬度坐标系
     * @return
     */
    public static Map<String, String> getCityByLonLat(String key, String lng, String lat) {
        String location = lat + "," + lng;
        try {
            //拼装url
            String url = "http://api.map.baidu.com/reverse_geocoding/v3/?ak="+key+"&output=json&coordtype=wgs84ll&location="+location;
            String result = HttpClientUtils.doGet(url);
            JSONObject o = new JSONObject(result);
            Map<String, String> area = new HashMap<>();
			area.put("province", o.getJSONObject("result").getJSONObject("addressComponent").getString("province"));
			area.put("city", o.getJSONObject("result").getJSONObject("addressComponent").getString("city"));
			area.put("district", o.getJSONObject("result").getJSONObject("addressComponent").getString("district"));
			area.put("street", o.getJSONObject("result").getJSONObject("addressComponent").getString("street"));
            return area;
        }catch (Exception e) {
            e.printStackTrace();
        }
        return null;
    }

    /**
	     * 获取API访问token
	     * 该token有一定的有效期,需要自行管理,当失效时需重新获取.
	     * @param ak - 百度云官网获取的 API Key
	     * @param sk - 百度云官网获取的 Securet Key
	     * @return assess_token
	     */
    public static String getAuth(String ak, String sk) {
        // 获取token地址
        String authHost = "https://aip.baidubce.com/oauth/2.0/token?";
        String getAccessTokenUrl = authHost
                // 1. grant_type为固定参数
                + "grant_type=client_credentials"
                // 2. 官网获取的 API Key
                + "&client_id=" + ak
                // 3. 官网获取的 Secret Key
                + "&client_secret=" + sk;
        try {
            URL realUrl = new URL(getAccessTokenUrl);
            // 打开和URL之间的连接
            HttpURLConnection connection = (HttpURLConnection) realUrl.openConnection();
            connection.setRequestMethod("GET");
            connection.connect();
            // 获取所有响应头字段
            Map<String, List<String>> map = connection.getHeaderFields();
            // 遍历所有的响应头字段
            for (String key : map.keySet()) {
                System.err.println(key + "--->" + map.get(key));
            }
            // 定义 BufferedReader输入流来读取URL的响应
            BufferedReader in = new BufferedReader(new InputStreamReader(connection.getInputStream()));
            String result = "";
            String line;
            while ((line = in.readLine()) != null) {
                result += line;
            }
            /**
             * 返回结果示例
             */
            System.err.println("result:" + result);
            org.json.JSONObject jsonObject = new org.json.JSONObject(result);
            String access_token = jsonObject.getString("access_token");
            return access_token;
        } catch (Exception e) {
            System.err.printf("获取token失败!");
            e.printStackTrace(System.err);
        }
        return null;
    }

}

ConfigServiceImpl.java

package com.service.impl;


import java.util.Map;

import org.springframework.stereotype.Service;

import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.dao.ConfigDao;
import com.entity.ConfigEntity;
import com.service.ConfigService;
import com.utils.PageUtils;
import com.utils.Query;


/**
 * 系统用户
 */
@Service("configService")
public class ConfigServiceImpl extends ServiceImpl<ConfigDao, ConfigEntity> implements ConfigService {
	@Override
	public PageUtils queryPage(Map<String, Object> params, Wrapper<ConfigEntity> wrapper) {
		Page<ConfigEntity> page = this.selectPage(
                new Query<ConfigEntity>(params).getPage(),
                wrapper
        );
        return new PageUtils(page);
	}
}

charts.js
/*
 * 图片转换对话框脚本
 **/

var tableData = [],
    //编辑器页面table
    editorTable = null,
    chartsConfig = window.typeConfig,
    resizeTimer = null,
    //初始默认图表类型
    currentChartType = 0;

window.onload = function () {

    editorTable = domUtils.findParentByTagName( editor.selection.getRange().startContainer, 'table', true);

    //未找到表格, 显示错误页面
    if ( !editorTable ) {
        document.body.innerHTML = "<div class='edui-charts-not-data'>未找到数据</div>";
        return;
    }

    //初始化图表类型选择
    initChartsTypeView();
    renderTable( editorTable );
    initEvent();
    initUserConfig( editorTable.getAttribute( "data-chart" ) );
    $( "#scrollBed .view-box:eq("+ currentChartType +")" ).trigger( "click" );
    updateViewType( currentChartType );

    dialog.addListener( "resize", function () {

        if ( resizeTimer != null ) {
            window.clearTimeout( resizeTimer );
        }

        resizeTimer = window.setTimeout( function () {

            resizeTimer = null;

            renderCharts();

        }, 500 );

    } );

};

function initChartsTypeView () {

    var contents = [];

    for ( var i = 0, len = chartsConfig.length; i<len; i++ ) {

        contents.push( '<div class="view-box" data-chart-type="'+ i +'"><img width="300" src="images/charts'+ i +'.png"></div>' );

    }

    $( "#scrollBed" ).html( contents.join( "" ) );

}

//渲染table, 以便用户修改数据
function renderTable ( table ) {

    var tableHtml = [];

    //构造数据
    for ( var i = 0, row; row = table.rows[ i ]; i++ ) {

        tableData[ i ] = [];
        tableHtml[ i ] = [];

        for ( var j = 0, cell; cell = row.cells[ j ]; j++ ) {

            var value = getCellValue( cell );

            if ( i > 0 && j > 0 ) {
                value = +value;
            }

            if ( i === 0 || j === 0 ) {
                tableHtml[ i ].push( '<th>'+ value +'</th>' );
            } else {
                tableHtml[ i ].push( '<td><input type="text" class="data-item" value="'+ value +'"></td>' );
            }

            tableData[ i ][ j ] = value;

        }

        tableHtml[ i ] = tableHtml[ i ].join( "" );

    }

    //draw 表格
    $( "#tableContainer" ).html( '<table id="showTable" border="1"><tbody><tr>'+ tableHtml.join( "</tr><tr>" ) +'</tr></tbody></table>' );

}

/*
 * 根据表格已有的图表属性初始化当前图表属性
 */
function initUserConfig ( config ) {

    var parsedConfig = {};

    if ( !config ) {
        return;
    }

    config = config.split( ";" );

    $.each( config, function ( index, item ) {

        item = item.split( ":" );
        parsedConfig[ item[ 0 ] ] = item[ 1 ];

    } );

    setUserConfig( parsedConfig );

}

function initEvent () {

    var cacheValue = null,
        //图表类型数
        typeViewCount = chartsConfig.length- 1,
        $chartsTypeViewBox = $( '#scrollBed .view-box' );

    $( ".charts-format" ).delegate( ".format-ctrl", "change", function () {

        renderCharts();

    } )

    $( ".table-view" ).delegate( ".data-item", "focus", function () {

        cacheValue = this.value;

    } ).delegate( ".data-item", "blur", function () {

        if ( this.value !== cacheValue ) {
            renderCharts();
        }

        cacheValue = null;

    } );

    $( "#buttonContainer" ).delegate( "a", "click", function (e) {

        e.preventDefault();

        if ( this.getAttribute( "data-title" ) === 'prev' ) {

            if ( currentChartType > 0 ) {
                currentChartType--;
                updateViewType( currentChartType );
            }

        } else {

            if ( currentChartType < typeViewCount ) {
                currentChartType++;
                updateViewType( currentChartType );
            }

        }

    } );

    //图表类型变化
    $( '#scrollBed' ).delegate( ".view-box", "click", function (e) {

        var index = $( this ).attr( "data-chart-type" );
        $chartsTypeViewBox.removeClass( "selected" );
        $( $chartsTypeViewBox[ index ] ).addClass( "selected" );

        currentChartType = index | 0;

        //饼图, 禁用部分配置
        if ( currentChartType === chartsConfig.length - 1 ) {

            disableNotPieConfig();

        //启用完整配置
        } else {

            enableNotPieConfig();

        }

        renderCharts();

    } );

}

function renderCharts () {

    var data = collectData();

    $('#chartsContainer').highcharts( $.extend( {}, chartsConfig[ currentChartType ], {

        credits: {
            enabled: false
        },
        exporting: {
            enabled: false
        },
        title: {
            text: data.title,
            x: -20 //center
        },
        subtitle: {
            text: data.subTitle,
            x: -20
        },
        xAxis: {
            title: {
                text: data.xTitle
            },
            categories: data.categories
        },
        yAxis: {
            title: {
                text: data.yTitle
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            enabled: true,
            valueSuffix: data.suffix
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 1
        },
        series: data.series

    } ));

}

function updateViewType ( index ) {

    $( "#scrollBed" ).css( 'marginLeft', -index*324+'px' );

}

function collectData () {

    var form = document.forms[ 'data-form' ],
        data = null;

    if ( currentChartType !== chartsConfig.length - 1 ) {

        data = getSeriesAndCategories();
        $.extend( data, getUserConfig() );

    //饼图数据格式
    } else {
        data = getSeriesForPieChart();
        data.title = form[ 'title' ].value;
        data.suffix = form[ 'unit' ].value;
    }

    return data;

}

/**
 * 获取用户配置信息
 */
function getUserConfig () {

    var form = document.forms[ 'data-form' ],
        info = {
            title: form[ 'title' ].value,
            subTitle: form[ 'sub-title' ].value,
            xTitle: form[ 'x-title' ].value,
            yTitle: form[ 'y-title' ].value,
            suffix: form[ 'unit' ].value,
            //数据对齐方式
            tableDataFormat: getTableDataFormat (),
            //饼图提示文字
            tip: $( "#tipInput" ).val()
        };

    return info;

}

function setUserConfig ( config ) {

    var form = document.forms[ 'data-form' ];

    config.title && ( form[ 'title' ].value = config.title );
    config.subTitle && ( form[ 'sub-title' ].value = config.subTitle );
    config.xTitle && ( form[ 'x-title' ].value = config.xTitle );
    config.yTitle && ( form[ 'y-title' ].value = config.yTitle );
    config.suffix && ( form[ 'unit' ].value = config.suffix );
    config.dataFormat == "-1" && ( form[ 'charts-format' ][ 1 ].checked = true );
    config.tip && ( form[ 'tip' ].value = config.tip );
    currentChartType = config.chartType || 0;

}

function getSeriesAndCategories () {

    var form = document.forms[ 'data-form' ],
        series = [],
        categories = [],
        tmp = [],
        tableData = getTableData();

    //反转数据
    if ( getTableDataFormat() === "-1" ) {

        for ( var i = 0, len = tableData.length; i < len; i++ ) {

            for ( var j = 0, jlen = tableData[ i ].length; j < jlen; j++ ) {

                if ( !tmp[ j ] ) {
                    tmp[ j ] = [];
                }

                tmp[ j ][ i ] = tableData[ i ][ j ];

            }

        }

        tableData = tmp;

    }

    categories = tableData[0].slice( 1 );

    for ( var i = 1, data; data = tableData[ i ]; i++ ) {

        series.push( {
            name: data[ 0 ],
            data: data.slice( 1 )
        } );

    }

    return {
        series: series,
        categories: categories
    };

}

/*
 * 获取数据源数据对齐方式
 */
function getTableDataFormat () {

    var form = document.forms[ 'data-form' ],
        items = form['charts-format'];

    return items[ 0 ].checked ? items[ 0 ].value : items[ 1 ].value;

}

/*
 * 禁用非饼图类型的配置项
 */
function disableNotPieConfig() {

    updateConfigItem( 'disable' );

}

/*
 * 启用非饼图类型的配置项
 */
function enableNotPieConfig() {

    updateConfigItem( 'enable' );

}

function updateConfigItem ( value ) {

    var table = $( "#showTable" )[ 0 ],
        isDisable = value === 'disable' ? true : false;

    //table中的input处理
    for ( var i = 2 , row; row = table.rows[ i ]; i++ ) {

        for ( var j = 1, cell; cell = row.cells[ j ]; j++ ) {

            $( "input", cell ).attr( "disabled", isDisable );

        }

    }

    //其他项处理
    $( "input.not-pie-item" ).attr( "disabled", isDisable );
    $( "#tipInput" ).attr( "disabled", !isDisable )

}

/*
 * 获取饼图数据
 * 饼图的数据只取第一行的
 **/
function getSeriesForPieChart () {

    var series = {
            type: 'pie',
            name: $("#tipInput").val(),
            data: []
        },
        tableData = getTableData();


    for ( var j = 1, jlen = tableData[ 0 ].length; j < jlen; j++ ) {

        var title = tableData[ 0 ][ j ],
            val = tableData[ 1 ][ j ];

        series.data.push( [ title, val ] );

    }

    return {
        series: [ series ]
    };

}

function getTableData () {

    var table = document.getElementById( "showTable" ),
        xCount = table.rows[0].cells.length - 1,
        values = getTableInputValue();

    for ( var i = 0, value; value = values[ i ]; i++ ) {

        tableData[ Math.floor( i / xCount ) + 1 ][ i % xCount + 1 ] = values[ i ];

    }

    return tableData;

}

function getTableInputValue () {

    var table = document.getElementById( "showTable" ),
        inputs = table.getElementsByTagName( "input" ),
        values = [];

    for ( var i = 0, input; input = inputs[ i ]; i++ ) {
        values.push( input.value | 0 );
    }

    return values;

}

function getCellValue ( cell ) {

    var value = utils.trim( ( cell.innerText || cell.textContent || '' ) );

    return value.replace( new RegExp( UE.dom.domUtils.fillChar, 'g' ), '' ).replace( /^\s+|\s+$/g, '' );

}


//dialog确认事件
dialog.onok = function () {

    //收集信息
    var form = document.forms[ 'data-form' ],
        info = getUserConfig();

    //添加图表类型
    info.chartType = currentChartType;

    //同步表格数据到编辑器
    syncTableData();

    //执行图表命令
    editor.execCommand( 'charts', info );

};

/*
 * 同步图表编辑视图的表格数据到编辑器里的原始表格
 */
function syncTableData () {

    var tableData = getTableData();

    for ( var i = 1, row; row = editorTable.rows[ i ]; i++ ) {

        for ( var j = 1, cell; cell = row.cells[ j ]; j++ ) {

            cell.innerHTML = tableData[ i ] [ j ];

        }

    }

}

声明

本博客适用于广泛的学术和教育用途,包括但不限于个人学习、开发设计,产品设计。仅供学习参考,旨在为读者提供深入理解和学术研究的材料。


http://www.kler.cn/a/329068.html

相关文章:

  • Linux网络:守护进程
  • C++---类型转换
  • Docker入门之Windows安装Docker初体验
  • 保存数据到Oracle时报错ORA-17004: 列类型无效: 1111
  • AJAX笔记 (速通精华版)
  • Cesium 相机系统
  • vscode中配置python虚拟环境
  • 大数据-151 Apache Druid 集群模式 配置启动【上篇】 超详细!
  • [深度学习]基于YOLO高质量项目源码+模型+GUI界面汇总
  • 如何通过Dockfile更改docker中ubuntu的apt源
  • Linux 搭建与使用yolov5训练和检验自建模型的步骤
  • Jenkins pipeline配置示例
  • NLP任务一些常用的数据集集锦
  • 解决 Adobe 盗版弹窗
  • 【Linux 从基础到进阶】HBase数据库安装与配置
  • 【DAY20240926】06从入门到精通:掌握 Git 分支操作的实用指南
  • 修复OpenSSH远程代码执行漏洞:版本升级到9.9p1
  • springboot启动流程
  • vue基于Spring Boot框架的高校实验室预约管理系统
  • 论文阅读:多模态医学图像融合方法的研究进展
  • golang rpc
  • TCP\IP标准与OSI标准
  • JS进阶 1——作用域、解构、箭头函数
  • 滚雪球学MySQL[3.2讲]:MySQL聚合函数与分组详解:COUNT、SUM、AVG、MAX、MIN及GROUP BY与HAVING
  • Qt 每日面试题 -5
  • 手机实时提取SIM卡打电话的信令声音-新的篇章(二、USB音频线初步探索)