纳税服务系统【信息发布管理、Ueditor、异步信息交互】
2017-06-05 19:09
441 查看
需求分析
我们现在来到了纳税服务系统的信息发布管理模块,首先我们跟着原型图来进行需求分析把:一些普通的CRUD,值得一做的就是状态之间的切换了。停用和发布切换。
值得注意的是:在信息内容中,它可以带格式地复制内容,然后上传到我们的服务器中。
流程图:
编写JavaBean与配置文件
javaBean
package zhongfucheng.info.entity; import java.sql.Timestamp; import java.util.HashMap; import java.util.Map; public class Info implements java.io.Serializable { private String infoId; private String type; private String source; private String title; private String content; private String memo; private String creator; private Timestamp createTime; private String state; public static String INFO_STATE_PUBLIC = "1";//发布 public static String INFO_STATE_STOP = "0";//停用 public static String INFO_TYPE_TZGG = "tzgg"; public static String INFO_TYPE_ZCSD = "zcsd"; public static String INFO_TYPE_NSZD = "nszd"; public static Map<String, String> INFO_TYPE_MAP = new HashMap<String, String>(); static { INFO_TYPE_MAP.put(INFO_TYPE_TZGG, "通知公告"); INFO_TYPE_MAP.put(INFO_TYPE_ZCSD, "政策速递"); INFO_TYPE_MAP.put(INFO_TYPE_NSZD, "纳税指导"); } public Info() { } public Info(String title) { this.title = title; } public Info(String type, String source, String title, String content, String memo, String creator, Timestamp createTime, String state) { this.type = type; this.source = source; this.title = title; this.content = content; this.memo = memo; this.creator = creator; this.createTime = createTime; this.state = state; } public String getInfoId() { return this.infoId; } public void setInfoId(String infoId) { this.infoId = infoId; } public String getType() { return this.type; } public void setType(String type) { this.type = type; } public String getSource() { return this.source; } public void setSource(String source) { this.source = source; } public String getTitle() { return this.title; } public void setTitle(String title) { this.title = title; } public String getContent() { return this.content; } public void setContent(String content) { this.content = content; } public String getMemo() { return this.memo; } public void setMemo(String memo) { this.memo = memo; } public String getCreator() { return this.creator; } public void setCreator(String creator) { this.creator = creator; } public Timestamp getCreateTime() { return this.createTime; } public void setCreateTime(Timestamp createTime) { this.createTime = createTime; } public String getState() { return this.state; } public void setState(String state) { this.state = state; } }
配置文件
package zhongfucheng.info.entity; import java.sql.Timestamp; import java.util.HashMap; import java.util.Map; public class Info implements java.io.Serializable { private String infoId; private String type; private String source; private String title; private String content; private String memo; private String creator; private Timestamp createTime; private String state; public static String INFO_STATE_PUBLIC = "1";//发布 public static String INFO_STATE_STOP = "0";//停用 public static String INFO_TYPE_TZGG = "tzgg"; public static String INFO_TYPE_ZCSD = "zcsd"; public static String INFO_TYPE_NSZD = "nszd"; public static Map<String, String> INFO_TYPE_MAP = new HashMap<String, String>(); static { INFO_TYPE_MAP.put(INFO_TYPE_TZGG, "通知公告"); INFO_TYPE_MAP.put(INFO_TYPE_ZCSD, "政策速递"); INFO_TYPE_MAP.put(INFO_TYPE_NSZD, "纳税指导"); } public Info() { } public Info(String title) { this.title = title; } public Info(String type, String source, String title, String content, String memo, String creator, Timestamp createTime, String state) { this.type = type; this.source = source; this.title = title; this.content = content; this.memo = memo; this.creator = creator; this.createTime = createTime; this.state = state; } public String getInfoId() { return this.infoId; } public void setInfoId(String infoId) { this.infoId = infoId; } public String getType() { return this.type; } public void setType(String type) { this.type = type; } public String getSource() { return this.source; } public void setSource(String source) { this.source = source; } public String getTitle() { return this.title; } public void setTitle(String title) { this.title = title; } public String getContent() { return this.content; } public void setContent(String content) { this.content = content; } public String getMemo() { return this.memo; } public void setMemo(String memo) { this.memo = memo; } public String getCreator() { return this.creator; } public void setCreator(String creator) { this.creator = creator; } public Timestamp getCreateTime() { return this.createTime; } public void setCreateTime(Timestamp createTime) { this.createTime = createTime; } public String getState() { return this.state; } public void setState(String state) { this.state = state; } }
常规增删改查
这现在对我们来说没有什么难度了,改之前写过的User模块就行了。编写dao、编写service、编写action、编写配置文件
将配置文件加载到总配置文件中。
导入前端的JSP页面
弄完之后,简单的增删改查我们已经实现了。。
接下来就是处理一些不是常用增删改查的东西了。
创建人与创建时间
我们在添加的时候怎么写呢???在需求上,不是让我们填的,而是写死的。<tr> <td class="tdBg" width="200px">创建人:</td> <td> </td> <td class="tdBg" width="200px">创建时间:</td> <td> </td> </tr>
创建人我们在Session中找到对应的用户,给出对应的值。显示出来后,在提交的时候还要通过隐藏域把数据带过去
<tr> <td class="tdBg" width="200px">创建人:</td> <td> <s:property value="#session.SYS_USER.name"/> <s:hidden value="#session.SYS_USER.name" name="info.creator"/> </td> <td class="tdBg" width="200px">创建时间:</td> <td> <s:date name="info.createTime" format="yyyy-MM-dd HH:MM"/> <s:hidden name="info.createTime"/> </td> </tr>
创建时间,我们可以直接在InfoAction中,new出Info对象,给出对应的值。在JSP页面就可以回显出来了。
当然了,我们也要通过隐藏域把数据带过去。
public String addUI() { ActionContext.getContext().getContextMap().put("infoTypeMap", Info.INFO_TYPE_MAP); info = new Info(); info.setCreateTime(new Timestamp(new Date().getTime())); return "addUI"; }
!
富文本框编辑器
我们想要在那个大文本框中,把复制的内容是带有格式的,图片也可以复制过去。普通的textarea是搞不掂的,我们需要借助别的组件。。我们用的是Ueditor组件使用步骤:
导入ueditor/jsp/lib目录中的“commons-codec-1.9.jar”、“json.jar”、“ueditor-1.1.1.jar”这几个jar包到项目的web-inf/lib目录中。配置 ueditor 中图片上传前缀和路径;打开“ueditor/jsp/config.json”
"imageUrlPrefix": "http://localhost:8080", /* 图片访问路径前缀 */ "imagePathFormat": "/upload/ueditor/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
在需要用到ueditor的Jsp页面用配置信息:
<script type="text/javascript" charset="utf-8" src="${basePath}js/ueditor/ueditor.config.js"></script> <script type="text/javascript" charset="utf-8" src="${basePath}js/ueditor/ueditor.all.min.js"> </script> <script type="text/javascript" charset="utf-8" src="${basePath}js/ueditor/lang/zh-cn/zh-cn.js"></script> <script> //配置ueditor的根路径 var UEDITOR_HOME_URL = "${basePath}js/ueditor/"; var ue = UE.getEditor('editor'); </script>
最后在我们的文本框中给出我们写的id就行了,也就是
var ue = UE.getEditor('editor');中的editor
<td colspan="3"><s:textarea id="editor" name="info.content" cssStyle="width:90%;height:160px;" /></td>
富文本框的配置我们大多数可以在这里修改:
效果:
很奇怪的是,如果单单访问info模块的话,使用是完全没有问题的。但是在总系统进入到info模块时,富文本框就点击不了:输入会显示输入个数,但是显示不了内容。编辑的时候同样看不到内容。
于是在网上搜了一下:把以下的代码加入到要用到富文本框的JSP页面下就解决掉问题了:
<script> setTimeout(function(){uParse('div', { 'highlightJsUrl':'/ueditor/third-party/SyntaxHighlighter/shCore.js', 'highlightCssUrl':'/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css'}) },300); </script>
参考博文:http://blog.csdn.net/eightwhells/article/details/13314069
异步信息交互
最后地,我们剩下停用与发布这个功能还没完成…其实就是一个异步信息交互的实现,当用户点击超链接为停用的时候,就到后台把数据更新,把Info的state变成为0,然后将超链接改成发布。
绑定事件
使用opertor前缀+id定位到我们的span节点中。这肯定是独一无二的。位于iterator内,直接写state判断就行了。
<span id="operator_<s:property value='infoId'/>"> <s:if test="state==1"> <a href="javascript:doPublic('<s:property value='infoId'/>',0)">停用</a> </s:if> <s:else> <a href="javascript:doPublic('<s:property value='infoId'/>',1)">发布</a> </s:else> </span>
ajax进行交互
注意在拼接字符串的时候,不要有空格………error:如果出错了,可以提示用户。
function doPublic (infoId,state){ $.ajax( { url: "${basePath}info/info_doPublic.action", data: { "info.infoId": infoId,"info.state": state}, type: "post", success: function (backData) { if ("更新成功" == backData) { if (state == 0) {//如果用户点击的是停用 //将超链接改成发布 $("#operator_"+infoId).html("<a href='javascript:doPublic(\""+infoId+"\",1)'>发布</a>"); //将显示状态改成是停用 $("#show_" + infoId).html("停用"); }else{//用户点击的是发布 //将超链接改成停用 $("#operator_"+infoId).html("<a href='javascript:doPublic(\""+infoId +"\",0)'>停用</a>"); //将显示状态改成是发布 $("#show_" + infoId).html("发布"); } }else { alert("更新失败,稍后重试"); } }, //如果失败了,就提示给用户,不要让用户继续操作了 error:function () { alert("更新失败,稍后重试"); } } ); } </script>
Action处理
得到用户的id,查询出Info对象的信息,再设置Info对象的属性。public void doPublic() { try { if (info != null) { //得到用户带过来的id查询出该对象 Info objectById = infoServiceImpl.findObjectById(info.getInfoId()); //设置它的状态 objectById.setState(info.getState()); //调用service更新数据库 infoServiceImpl.update(objectById); //返回数据给浏览器 HttpServletResponse response = ServletActionContext.getResponse(); response.setContentType("text/html charset=utf-8"); response.getOutputStream().write("更新成功".getBytes("UTF-8")); } } catch (IOException e) { e.printStackTrace(); } }
相关文章推荐
- 纳税服务系统【信息发布管理、Ueditor、异步信息交互】
- 纳税服务系统【投诉受理管理,显示投诉信息、处理回复、我要投诉】
- 纳税服务系统【投诉受理管理,显示投诉信息、处理回复、我要投诉】
- 弹出应用程序: 服务控制管理器 : 在系统启动时至少有一个服务或驱动程序产生错误。详细信息,请使用事件查看器查看事件日志
- [置顶]信息发布系统 Jquery+MVC架构开发(6)BLL层提供WCF 服务
- 网信办发布《互联网用户公众账号信息服务管理规定》
- 搭建随需应变的企业信息管理平台——蓝点发布通用管理系统V10版
- 【SSH项目实战】国税协同平台-19.信息发布管理完善&ueditor文本编辑插件
- 网信办发布《互联网群组信息服务管理规定》
- CMS内容管理系统开发- Java Web开发及发布实例(2)—使用JSP实现动态数据交互
- [新闻发布系统]新手最爱的信息管理系统代码,为了应付老师写的代码之一
- JeeSite 企业信息管理系统基础框架 V1.0.1 发布了
- “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第五篇(用户管理之“用户权限分配”)
- 网信办发布《互联网群组信息服务管理规定》
- WMI,列出服务器进程信息及系统服务信息及管理帐号等。
- [置顶]信息发布系统 Jquery+MVC架构开发(6)BLL层提供WCF 服务
- 信息发布系统 Jquery+MVC架构开发(6)BLL层提供WCF 服务 .
- “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第四篇(用户管理功能的实现)
- 网信办发布《互联网用户公众账号信息服务管理规定》
- [译]REST和微服务——用异步交互分解单体系统