【基于JavaWeb框架的B2B合作交易服务平台开发设计16000字（论文）】

第2章应用需求分析与可行性分析第3章相关技术简介3、相关技术简介3.1JSP技术简介JSP（JavaServer

Pages）是由Sun

Microsystems率先提出的动态网页技术标准，许多公司都参与其中。将Java程序段（Scriptlet）和JSP标记（标记）插入传统的Web页面HTML文件（*.htm，*。html）中以形成JSP文件（*.jsp）。用JSP开发的Web应用程序是跨平台的，可以在Linux或其他操作系统下运行。JSP技术使用Java编程语言编写类似XML的标记和scriptlet，以封装处理逻辑以生成动态网页。网页还可以通过标签和脚本来访问服务器上存在的资源的应用程序逻辑。JSP将网页逻辑与网页布局和显示分开，支持可重用的基于组件的设计，并使基于Web的应用程序开发变得轻松快捷。当Web服务器遇到访问JSP网页的请求时，它首先在其上执行程序段，然后将执行结果与JSP文件中的HTML代码一起返回给客户端。插入的Java程序段可以操作数据库，重定向网页等。执行建立动态网页所需的功能。JSP与Java

Servlet一样，在服务器端运行，HTML文本通常返回给客户端，因此只要有浏览器，客户端就可以浏览。JSP的主要优先事项如下：（1）写一次，到处跑。在这一点上，Java比PHP更好，除了系统之外，无需更改代码。（2）多平台系统支持。基本上，它可以在所有平台上的任何环境中开发，可以在任何环境中进行系统部署，也可以在任何环境中进行扩展。与JSP/PHP相比，其局限性显而易见。（3）强大的可扩展性。从仅使用一个很小的war文件即可运行Servlet/JSP，到捆绑和负载均衡多个服务器，再到用于事务处理和消息处理的多个应用程序，从一台服务器到无数服务器，Java都显示出了巨大的生命力。（4）强大而多样化的开发工具支持。这与JSP非常相似。Java有许多出色的开发工具，其中许多是免费提供的，并且其中许多可以在多个平台上无缝运行。3.2MySql数据库MySql开发人员的初衷是使用MySql和他们自己的快速低级例程（ISAM）连接表。无论如何，经过一些测试，开发人员得出的结论是：MySql并没有他们所需的速度和灵活性。这导致为数据库创建一个新的SQL接口，该接口使用与MySql几乎相同的API接口。通过这种方式，该API的设计允许将为MySql编写的第三方代码更轻松地传输到MySql。MySql概述MySql是一个关系数据库管理系统。如今，MySql已广泛用于Internet上的中小型网站。由于其规模小，速度快，总拥有成本低，尤其是开放源代码功能，许多中小型网站选择MySql作为网站数据库，以降低网站的总拥有成本。MySql功能1.用C和C

++编写，并经过各种编译器测试，以确保源代码可移植性。2.支持各种操作系统，例如Mac

OS和Windows3.提供多种编程语言的API。这些编程语言包括C，C

++，Eiffel，Java，Perl，Python，Ruby和Tcl。4.支持多线程，充分利用CPU资源5.优化的SQL查询算法，有效提高查询速度6.它可以在客户端-服务器网络环境中用作单独的应用程序，也可以集成到其他软件（例如提供多语言支持的库）中，并提供常见编码，例如中文GB

2312，BIG5，日语Shift_JIS，等等。可用作数据表名称和数据列名称7.提供各种数据库连接方法，例如TCP/IP，JDBC和JDBC。8.提供管理工具来管理，检查和优化数据库操作。9.可以处理具有数千万条记录的大型数据库。MySql应用与其他大型数据库（例如Oracle和DB2）相比，MySql有其自身的缺点，例如功能有限和规模小，但这丝毫没有降低其受欢迎程度。对于一般个人用户和中小型企业，MySql提供的功能已绰绰有余。MySQL管理您可以使用命令行工具来管理MySql数据库，也可以使用sqlserver附带的业务管理器来管理它，它具有友好的界面和简单的操作。MySQL存储引擎MySql

master的默认数据库，使用最多。具有较高的插入和查询速度，但不支持事务InnoDB事务数据库的首选引擎，支持ACID事务和行级锁定BDB派生自Berkeley

DB，Berkeley

DB是事务数据库的另一个选项，它支持其他事务功能，例如COMMI和ROLLBACK内存将所有数据放置在内存中的存储引擎，具有极高的插入，更新和查询效率。但是它将占用与数据量成比例的内存空间。重新启动MySql时，其内容将丢失合并将多个MyISAM表合并为一个整体，这对于大规模数据存储非常有用。该归档文件非常适合存储大量独立数据，例如历史记录。因为他们不经常阅读。该文件具有高效的插入速度，但是其查询支持相对较差。Federated将不同的MySql服务器组合在一起，以逻辑方式形成一个完整的数据库。分布式应用的理想选择高度冗余的集群/NDB存储引擎使用多个数据机一起提供服务，以提高整体性能和安全性。适用于具有大量数据，高安全性和性能要求的应用程序。CSV是一种存储引擎，可以逻辑上用逗号分隔数据BlackHole黑洞引擎，所有写入的数据将消失另外，MySql存储引擎接口也定义得很好。有兴趣的开发人员通过阅读文档来编写自己的存储引擎。MySql最常见的应用程序体系结构独特，适用于小规模应用复制（Replication），适用于中小型应用程序集群，适用于大规模应用。3.3Spring-BootSpring框架是Java平台上的一种开源应用框架，提供具有控制反转特性的容器。尽管Spring框架自身对编程模型没有限制，但其在Java应用中的频繁使用让它备受青睐，以至于后来让它作为EJB（EnterpriseJavaBeans）模型的补充，甚至是替补。Spring框架为开发提供了一系列的解决方案，比如利用控制反转的核心特性，并通过依赖注入实现控制反转来实现管理对象生命周期容器化，利用面向切面编程进行声明式的事务管理，整合多种持久化技术管理数据访问，提供大量优秀的Web框架方便开发等等。Spring框架具有控制反转（IOC）特性，IOC旨在方便项目维护和测试，它提供了一种通过Java的反射机制对Java对象进行统一的配置和管理的方法。Spring框架利用容器管理对象的生命周期，容器可以通过扫描XML文件或类上特定Java注解来配置对象，开发者可以通过依赖查找或依赖注入来获得对象。Spring框架具有面向切面编程（AOP）框架，SpringAOP框架基于代理模式，同时运行时可配置；AOP框架主要针对模块之间的交叉关注点进行模块化。Spring框架的AOP框架仅提供基本的AOP特性，虽无法与AspectJ框架相比，但通过与AspectJ的集成，也可以满足基本需求。Spring框架下的事务管理、远程访问等功能均可以通过使用SpringAOP技术实现。Spring的事务管理框架为Java平台带来了一种抽象机制，使本地和全局事务以及嵌套事务能够与保存点一起工作，并且几乎可以在Java平台的任何环境中工作。Spring集成多种事务模板，系统可以通过事务模板、XML或Java注解进行事务配置，并且事务框架集成了消息传递和缓存等功能。Spring的数据访问框架解决了开发人员在应用程序中使用数据库时遇到的常见困难。它不仅对Java:JDBC、iBATS/MyBATIs、Hibernate、Java数据对象（JDO）、ApacheOJB和ApacheCayne等所有流行的数据访问框架中提供支持，同时还可以与Spring的事务管理一起使用，为数据访问提供了灵活的抽象。Spring框架最初是没有打算构建一个自己的WebMVC框架，其开发人员在开发过程中认为现有的StrutsWeb框架的呈现层和请求处理层之间以及请求处理层和模型之间的分离不够，于是创建了SpringMVC。SpringBoot所具备的特征有：（1）可以创建独立的Spring应用程序，并且基于其Maven或Gradle插件，可以创建可执行的JARs和WARs；（2）内嵌Tomcat或Jetty等Servlet容器；（3）提供自动配置的“starter”项目对象模型（POMS）以简化Maven配置；（4）尽可能自动配置Spring容器；（5）提供准备好的特性，如指标、健康检查和外部化配置；（6）绝对没有代码生成，不需要XML配置。SpringBoot框架中还有两个非常重要的策略：开箱即用和约定优于配置。开箱即用，Outofbox，是指在开发过程中，通过在MAVEN项目的pom文件中添加相关依赖包，然后使用对应注解来代替繁琐的XML配置文件以管理对象的生命周期。这个特点使得开发人员摆脱了复杂的配置工作以及依赖的管理工作，更加专注于业务逻辑。约定优于配置，Convention

over

configuration，是一种由SpringBoot本身来配置目标结构，由开发者在结构中添加信息的软件设计范式。这一特点虽降低了部分灵活性，增加了BUG定位的复杂性，但减少了开发人员需要做出决定的数量，同时减少了大量的XML配置，并且可以将代码编译、测试和打包等工作自动化。SpringBoot应用系统开发模板的基本架构设计从前端到后台进行说明：前端常使用模板引擎，主要有FreeMarker和Thymeleaf，它们都是用Java语言编写的，渲染模板并输出相应文本，使得界面的设计与应用的逻辑分离，同时前端开发还会使用到Bootstrap、AngularJS、JQuery等；在浏览器的数据传输格式上采用Json，非xml，同时提供RESTfulAPI；SpringMVC框架用于数据到达服务器后处理请求；到数据访问层主要有Hibernate、MyBatis、JPA等持久层框架；数据库常用MySQL；开发工具推荐IntelliJIDEA。3.4B/S模式分析C/S模型主要由三个组件组成：客户端应用程序（Client），服务器管理程序（Server）和中间件（中间件）。客户端应用程序是用户与数据进行交互的系统的一部分。服务器程序负责有效地管理系统资源，例如管理信息数据库。它的主要工作是在多个客户端同时从服务器请求相同资源时优化这些资源的管理。中间件负责连接客户端应用程序和服务器管理程序，以完成协调工作，以满足用户查询和管理数据的要求。B/S模式是基于Web技术的MIS系统的一种新的平台模式。传统C/S模型中的服务器部分分为数据服务器和一个或多个应用程序服务器（Web服务器），以形成三层的客户端-服务器系统。一级客户端是用户和整个系统之间的接口。客户端应用程序被简化为通用浏览器软件，例如NetscapeNavigator，Microsoft

IE等。浏览器将HTML代码转换为带有图像和文本的网页。该网站还具有某些交互功能，允许用户以网站上提供的请求表的形式输入信息，将其提交到后端，并进行处理请求。该后端是第二级Web服务器。第二级Web服务器将启动相应的进程以响应此请求，并将动态生成一串HTML代码，该字符串嵌入处理结果并将其返回给客户端的浏览器。如果客户端发送的请求包括数据访问，则Web服务器还必须与数据库服务器合作以完成此处理。第三级数据库服务器任务类似于C/S模型，它负责协调不同Web服务器发出的SQ请求并管理数据库。B/S模式使客户首先变得容易。您无需在不同的客户端（例如C/S模式）上安装不同的客户端应用程序，而只需安装通用的浏览器软件。这不仅节省了客户硬盘驱动器和内存的空间，而且使安装过程更容易，并使网络结构更加灵活。假设公司的决策层希望打开物流信息来讨论库存问题，那么他们只需要从物流信息室中的计算机直接通过浏览器查询数据，然后将其显示给所有人。参与者甚至可以将他们的笔记本电脑连接到物流信息室的网络插孔，以查询自己的相关数据。其次，它简化了系统开发和维护。系统开发人员不再需要为不同级别的用户设计和开发不同的客户端应用程序，他们只需要在Web服务器上实现所有功能，并为不同功能的不同用户组设置权限。每个用户都通过HTTP请求在权限范围内在Web服务器上调用不同的处理程序，以完成数据的查询或修改。现代企业面临着瞬息万变的竞争环境，其内部运营机制的更新和调整变得更加频繁。与C/S相比，B/S维护具有更大的灵活性。当情况发生变化时，不必更新所有现有的客户端应用程序，您只需要检查Web服务器上的服务控制器即可。这不仅提高了公司的运营效率，而且避免了维护过程中的许多协调问题。如果一家公司有成千上万的客户，并且他们分布在不同的位置，那么易于维护就显得尤为重要。同样，它使用户操作更加容易。对于C/S模型，客户端应用程序具有其自己的特定规范，并且用户必须接受特殊培训。当使用B/S模式时，客户端只是一个简单易用的浏览器软件。无论是决策级别还是操作级别的人员，都可以直接使用而无需培训，就可以直接使用。B/S模式的这种特性，还使

MIS系统维护的限制因素更少。最后，B/S特别适合于在线发布信息，从而扩展了传统MIS的功能。这是C/S无法实现的。而这种新的在线信息发布功能正是现代企业所需要的。这样就可以用电子文件代替公司的大部分书面文件，从而提高了公司的工作效率，简化了公司的行政程序，节省了人力和物力。鉴于B/S相对于C/S的先进性，B/S已逐渐成为流行的MIS系统平台。软件公司已经推出了自己的Internet解决方案，基于Web的财务系统和基于Web的ERP。一些公司已经开始使用它，并且已经取得了一些成果。B/S模型的新颖性和流行性以及在某些方面对C/S的巨大改进，使B/S成为MIS系统平台的首选。该系统也还是采用B/S结构开发。第4章系统分析第4章系统分析4、系统分析4.1系统实现目标随着信息产业的蓬勃发展和人们对办公自动化的认识的提高，管理业务交易信息的工作越来越繁重。原始的信息管理系统不再能够完全满足相关人员的需求。为了帮助信息产业进行交易信息管理，提高工作效率，充分利用信息产业现有资源，必须建立更好的交易中合作信息管理系统。商业交易合作信息管理系统使用IT技术进行商业交流和合作交易信息管理。它可以收集和存储业务信息，提供更新和检索界面，帮助行业进行交易信息管理，并提高工作效率。商业交易信息管理系统采用B/S结构，结合网络数据库开发技术来设计该系统。基于Javaweb，使用spring

boot2框架，Maven，MySQL，IDEA和其他工具，并结合了Mybatis，beetl和开源项目。完成以下基本功能：该系统是一个独立的系统，用于解决企业的B2B交易信息管理问题。使用JSP技术构建有效且实用的业务交易合作信息管理平台，目的是有效完成业务对业务交易管理。1.新闻发布功能：包括合作计划，通知管理，新闻管理；包括可以在所有网站的主页上修改，添加和删除的新闻，公告和合作计划。2.交易信息管理功能：包括订单管理，版本管理，取消管理，跟进管理和变更管理；3.公司客户管理功能：包括客户公司交易意向的文件管理，产品管理，档案管理和结算管理；客户文件管理管理员登录可以查看和管理所有注册用户的注册信息（管理员需要请求和添加VIP用户注册），并且大公司客户结算（VIP客户）可以单独或分批（包括单个或多个）投标批量发布的投标项目）4.管理功能：包括现金管理，客户应收账款结算和运费结算。5.运营统计分析功能：包括交易统计，信息公示，交易统计，优秀合作等统计报告；6.查询功能：包括内部公开查询和客户在线查询（普通客户在线，公司客户在线）的功能。用户只能单击以查看主页的公共内容，他们可以检查自己的交易信息并显示跟踪。用户登录必须具有两种登录方法：访问者和公司客户。同时，您可以查看行业信息和其他公司资料，合作要求以及合作项目的意图。商业交易合作管理系统具有标准商业管理系统所具有的现实交易信息管理的完整步骤，并且是在虚拟现实中完全执行的。它实际上执行业务交易信息管理系统的功能，同时节省资源，提高效率和业务处理。4.2系统体系结构在系统功能分析的基础上，做系统功能模块图如下：新闻信息管理新闻信息管理合作信息管理交易信息管理会员信息管理系统管理交易信息管理会员信息管理系统管理信息添加信息添加信息修改信息删除交易信息添加交易信息修改交易信息删除交易信息浏览会员信息浏览会员信息管理添加用户重新登录更改密码图4-2系统功能模块图4.3主控流程图开始开始输入用户名、密码输入用户名、密码密码正确？密码正确？NNYY进入主控模块进入主控模块选择操作方式选择操作方式退出系统Y退出系统Y停止停止图4-3主控流程图4.4系统ER图用户名用户名密码管理员管理交易信息管理系统用户信息修改密码资讯信息交易信息会员信息增加信息修改信息用户登录增加用户查看信息图4-4系统ER图第5章系统设计第5章系统设计5、系统设计该系统不仅需要完善的功能，而且还需要友好的界面，因此对于成功的系统设计而言，功能模块设计是关键。5.1概要设计在系统需求分析阶段，阐明了软件“做什么”的问题，并形成了目标系统的逻辑模型。我们现在要做的是将软件“执行”的逻辑模型转换为“如何执行”的物理模型，也就是说，开始实现系统需求。首先，我们需要描述的是系统的总体架构。5.2系统结构设计系统方案设计中最重要的是系统的模块化。模块化是指在解决复杂问题时将软件系统逐层划分为多个模块的过程。每个模块执行特定的功能，并且所有模块以某种特定的方式组织起来以形成一个整体，以完成整个系统所需的功能。将系统划分为多个模块是为了降低软件系统的复杂性并提高可读性和可维护性，但是，模块的划分不能是任意的，应保持尽可能独立。也就是说，每个模块仅完成系统所需的独立子功能，并且与其他模块和简单接口的接触最少，即试图实现高内聚和低耦合，提高模块独立性并设计出高质量的产品。软件结构奠定了基础。在系统架构设计中，结构化设计基于需求分析阶段生成的数据流程图，并根据某些步骤映射到软件结构中。首先，将整个系统分为几个小问题，小模块。然后进一步细分模块并添加详细信息。5.3详细设计5.3.1管理员登录界面对于一个完整的商业交易合作信息管理系统，它不仅需要强大的功能和简单的操作，还需要良好的设计风格和吸引人的界面。登录界面对于整个系统非常重要，因为它设置了进入系统的用户名和密码，以防止非法用户进入系统并破坏系统安全性和保存的数据。只有合法的管理员才能输入正确的密码。您可以登录系统；否则，将提示您输入错误的密码或用户名，并询问用户是否重新输入。这限制了用户，增加了系统安全性和机密性，有利于控制和管理，并有利于系统维护。图5-3-1管理员登录界面主要代码如下：<!DOCTYPEhtml><html> <head> <%@includefile="common.jsp"%> </head> <bodyclass="light-gray-bg"style="background-image:url('${ctxs}/images/back.jpeg');background-size:cover;"> <divclass="templatemo-content-widgettemplatemo-login-widgetwhite-bg"style="margin-top:10%"> <headerclass="text-center"> <h1>刘泇希毕设B2B交易后台管理系统<br><small>管理员后台</small></h1> </header> <formaction="${ctxf}/login"method="post"class="templatemo-login-form"> <divclass="form-group"> <divclass="input-group"> <divclass="input-group-addon"><iclass="fafa-userfa-fw"></i></div> <inputtype="text"name="uname"value="admin"class="form-control"placeholder=""required="required"> </div> </div> <divclass="form-group"> <divclass="input-group"> <divclass="input-group-addon"><iclass="fafa-keyfa-fw"></i></div> <inputtype="password"name="upass"value="123456"class="form-control"placeholder=""required="required"> </div> </div> <divclass="form-group"> <pstyle="color:red;">${msg}</p> <buttontype="submit"class="templatemo-blue-buttonwidth-100">登录</button> </div> </form> </div> </body></html>5.3.2管理员设置系统管理模块是系统的基本部分。在此模块中，管理员可以重置自己的密码，并可以定期更改密码以确保数据安全。增加了系统的安全性和机密性，易于控制和管理。图5-3-2管理员设置主要代码如下：<%@pagelanguage="java"contentType="text/html;charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPEhtml><htmllang="en"><head><%@includefile="common.jsp"%></head><body><!--Leftcolumn--><divclass="templatemo-flex-row"><%@includefile="left.jsp"%><!--Maincontent--><divclass="templatemo-contentcol-1light-gray-bg"><%@includefile="top.jsp"%><divclass="templatemo-content-container"><divclass="templatemo-content-widgetwhite-bg"><h2class="margin-bottom-10">修改密码</h2><formaction="${ctxf}/complany/updateUpass"class="templatemo-login-form"method="post"><divclass="rowform-group"><divclass="col-lg-12form-group"><labelfor="inputFirstName">原密码：</label><inputtype="password"name="old_upass"required="required"pattern="(\w){6,20}"class="form-control"></div><divclass="col-lg-12form-group"><labelfor="inputFirstName">新密码：</label><inputtype="password"name="new_upass"required="required"pattern="(\w){6,20}"class="form-control"> <p>格式：6-20位数字或者字母组成</p></div><divclass="col-lg-12form-group"><labelfor="inputFirstName">新密码：</label><inputtype="password"name="new_upass2"required="required"pattern="(\w){6,20}"class="form-control"> <p>格式：6-20位数字或者字母组成</p></div></div><divclass="form-grouptext-center"> <pstyle="color:red;">${msg}</p><buttontype="submit"class="templatemo-blue-button">确定修改</button></div></form></div><%@includefile="footer.jsp"%></div></div></div><!--TemplatemoScript--></body></html>5.3.3资讯信息管理模块该模块主要实现新闻信息的添加，删除，修改和搜索等操作。如下所示：图5-3-3-1资讯信息添加模块图5-3-3-2资讯信息管理模块主要代码如下：<%@pagelanguage="java"contentType="text/html;charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPEhtml><htmllang="en"><head><%@includefile="common.jsp"%><!--simditor--> <linkrel="stylesheet"type="text/css"href="${ctxs}/js/simditor-1.0.5/styles/font-awesome.css"/><linkrel="stylesheet"type="text/css"href="${ctxs}/js/simditor-1.0.5/styles/simditor.css"/> <!--simditor--></head><body><!--Leftcolumn--><divclass="templatemo-flex-row"><%@includefile="left.jsp"%><!--Maincontent--><divclass="templatemo-contentcol-1light-gray-bg"><%@includefile="top.jsp"%><divclass="templatemo-content-container"><divclass="templatemo-content-widgetwhite-bg"><h2class="margin-bottom-10">添加&编辑新闻</h2><formaction="${ctxf}/news/save"class="templatemo-login-form"method="post"><inputtype="hidden"name="id"value="${o.id}"><inputtype="hidden"name="pageNo"value="${pageNo}"><divclass="rowform-group"><divclass="col-lg-12form-group"><label>标题：</label><inputtype="text"name="title"value="${o.title}"maxlength="50"required="required"class="form-control"></div><divclass="col-lg-12form-group"><label>简介：</label><textareaname="cdesc"maxlength="200"required="required"class="form-control">${o.cdesc}</textarea></div><divclass="col-lg-12form-group"><label>内容：</label><textareaid="editor"name="context"></textarea> <divstyle="display:none;"id="editor_2">${o.context}</div></div><divclass="col-lg-12form-group"><label>来源：</label><inputtype="text"name="cfrom"value="${o.cfrom}"placeholder="选填"maxlength="20"class="form-control"></div></div><divclass="form-grouptext-center"> <pstyle="color:red;">${msg}</p><buttontype="submit"class="templatemo-blue-button">确定修改</button><buttontype="reset"class="templatemo-white-button">重置</button></div></form></div><%@includefile="footer.jsp"%></div></div></div> <!--simditor--><scripttype="text/javascript"src="${ctxs}/js/simditor-1.0.5/scripts/js/module.js"></script><scripttype="text/javascript"src="${ctxs}/js/simditor-1.0.5/scripts/js/uploader.js"></script><scripttype="text/javascript"src="${ctxs}/js/simditor-1.0.5/scripts/js/simditor.js"></script><!--simditor--> <scripttype="text/javascript"> toolbar=['title','bold','italic','underline','strikethrough', 'color','|','ol','ul','blockquote','code','table','|', 'link','image','hr','|','indent','outdent']; vareditor=newSimditor({ textarea:$('#editor'), placeholder:'请输入内容', pasteImage:true, toolbarFloat:true, toolbar:toolbar, defaultImage:'${ctxs}/static/js/simditor-1.0.5/images/image.png', upload:{ url:'${ctxf}/news/upimg',//文件上传的接口地址 params:{}, fileKey:'file', connectionCount:3, leaveConfirm:'上传中...' } }); varid=$('input[name=id]').val(); if(parseInt(id)>0){ editor.setValue($('#editor_2').html()); } </script></body></html>5.3.4交易信息管理模块本模块主要实现对交易信息的管理功能，包括：增加、删除、修改、浏览操作。如下图所示：图5-3-4-1交易信息管理模块图5-3-4-2交易信息添加模块核心代码如下：<%@pagelanguage="java"contentType="text/html;charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPEhtml><htmllang="en"><head><%@includefile="common.jsp"%><!--simditor--> <linkrel="stylesheet"type="text/css"href="${ctxs}/js/simditor-1.0.5/styles/font-awesome.css"/><linkrel="stylesheet"type="text/css"href="${ctxs}/js/simditor-1.0.5/styles/simditor.css"/> <!--simditor--></head><body><!--Leftcolumn--><divclass="templatemo-flex-row"><%@includefile="left.jsp"%><!--Maincontent--><divclass="templatemo-contentcol-1light-gray-bg"><%@includefile="top.jsp"%><divclass="templatemo-content-container"><ahref="javascript:history.go(-1);"style="line-height:40px;margin-left:20px;"><<返回上一页</a><divclass="templatemo-content-widgetwhite-bg"><h2class="margin-bottom-10">交易记录的添加&编辑</h2><formaction="${ctxf}/trade/save"class="templatemo-login-form"method="post"onsubmit="returnsub();"><inputtype="hidden"name="id"value="${o.id}"><inputtype="hidden"name="pageNo"value="${pageNo}"><divclass="rowform-group"> <divclass="col-lg-12form-group"><label>标题：</label><inputtype="text"name="title"value="${o.title}"maxlength="50"required="required"class="form-control"></div><divclass="col-lg-12form-group"><label>甲方单位名称：</label><inputtype="hidden"id="complany_jf"name="complany_jf"value="${plany_jf}"><inputtype="text"id="cname_jf"name="cname_jf"value="${ame_jf}"maxlength="50"required="required"class="form-control"readonly="readonly"></div><divclass="col-lg-12form-group"><label>乙方单位名称：</label><inputtype="hidden"id="complany_yf"name="complany_yf"value="${plany_yf}"><inputtype="text"id="cname_yf"name="cname_yf"value="${ame_yf}"maxlength="50"required="required"class="form-control"readonly="readonly"></div><divclass="col-lg-12form-group"><label>交易单号：</label><inputtype="text"name="trade_no"value="${o.trade_no}"maxlength="50"required="required"class="form-control"></div><divclass="col-lg-12form-group"><label>详细信息：</label><textareaid="editor"name="context"></textarea> <divstyle="display:none;"id="editor_2">${o.context}</div></div></div><divclass="form-grouptext-center"> <pstyle="color:red;">${msg}</p><buttontype="submit"class="templatemo-blue-button">确定修改</button><buttontype="reset"class="templatemo-white-button">重置</button></div></form></div><%@includefile="footer.jsp"%></div></div></div><!--模态框（Modal）--><divclass="modalfade"id="choose_complany"tabindex="-1"role="dialog"aria-labelledby="myModalLabel"aria-hidden="true"> <divclass="modal-dialog"> <divclass="modal-content"> <divclass="modal-header"> <buttontype="button"class="close"data-dismiss="modal"aria-hidden="true"> × </button> <h4class="modal-title"> 选择企业 </h4> </div> <divclass="modal-body"id="seeinfo_body"> <formclass="form-inline"action="#"method="post"id="complany_search_form"><divclass="row"> <divclass="col-sm-5"> <divclass="form-group"> <inputtype="text"name="cname"class="form-control"placeholder="企业名称"style="width:100%;"> </div> </div> <divclass="col-sm-5"> <divclass="form-group"> <inputtype="text"name="mobile"class="form-control"placeholder="注册手机号"style="width:100%;"> </div> </div> <divclass="col-sm-2"> <divclass="form-group"> <buttontype="button"class="btnbtn-success"id="search_complany_btn">搜索</button> </div> </div> </div></form> <tableclass="tabletable-stripedtable-hover"> <thead> <tr> <th>企业名称</th> <th>手机号</th> <th>简介</th> </tr> </thead> <tbodyid="complany_show"> </tbody> </table> <divstyle="text-align:center;"> <pid="more_tip"data-p=1></p> <ahref="javascript:;"id="pre_p">上一页/</a> <ahref="javascript:;"id="next_p">下一页</a> </div> </div> <divclass="modal-footer"> <buttontype="button"class="btnbtn-default"data-dismiss="modal">关闭 </button> </div> </div><!--/.modal-content--> </div><!--/.modal--></div> <!--simditor--><scripttype="text/javascript"src="${ctxs}/js/simditor-1.0.5/scripts/js/module.js"></script><scripttype="text/javascript"src="${ctxs}/js/simditor-1.0.5/scripts/js/uploader.js"></script><scripttype="text/javascript"src="${ctxs}/js/simditor-1.0.5/scripts/js/simditor.js"></script><!--simditor--> <scripttype="text/javascript"> toolbar=['title','bold','italic','underline','strikethrough', 'color','|','ol','ul','blockquote','code','table','|', 'link','image','hr','|','indent','outdent']; vareditor=newSimditor({ textarea:$('#editor'), placeholder:'请输入详细内容', pasteImage:true, toolbarFloat:true, toolbar:toolbar, defaultImage:'${ctxs}/static/js/simditor-1.0.5/images/image.png', upload:{ url:'${ctxf}/trade/upimg',//文件上传的接口地址 params:{}, fileKey:'file', connectionCount:3, leaveConfirm:'上传中...' } }); varid=$('input[name=id]').val(); if(parseInt(id)>0){ editor.setValue($('#editor_2').html()); }else{ editor.setValue(''); } type=""; $('#cname_jf').click(function(){ $('#choose_complany').modal('show'); type="jf"; get_complanys(); }) $('#cname_yf').click(function(){ $('#choose_complany').modal('show'); type="yf"; get_complanys(); }) $('#search_complany_btn').click(function(){ get_complanys(); }) functionget_complanys(){ varcname=$('#complany_search_forminput[name=cname]').val(); varmobile=$('#complany_search_forminput[name=mobile]').val(); varpageNo=parseInt($('#more_tip').attr('data-p')); $.ajax({ url:'${ctxf}/complany/page_ajax', type:'post', data:{cname:cname,mobile:mobile,pageNo:pageNo}, dataType:'json', success:function(data){ if(data.hasNextPage==false)$('#next_p').hide(); else$('#next_p').show(); if(data.hasPreviousPage==false)$('#pre_p').hide(); else$('#pre_p').show(); if(data.total==0)$('#more_tip').text('没有数据了'); else{ $('#more_tip').text('共'+data.total+'数据，共'+data.pages+'页'); } vars=""; for(vari=0;i<data.list.length;i++){ s+='<trdata-id='+data.list[i].id+'data-cname="'+data.list[i].cname+'"data-mobile="'+data.list[i].mobile+'"data-cdesc="'+data.list[i].cdesc+'"><td>'+data.list[i].cname+'</td><td>'+data.list[i].mobile+'</td><td>'+data.list[i].cdesc+'</td></tr>'; } $('#complany_show').html(s); } }) } $('#complany_show').on('click','tr',function(){ varc=$(this).attr('data-cname'); varid=$(this).attr('data-id'); if(type=="jf"){ $('#cname_jf').val(c); $('#complany_jf').val(id); }if(type=="yf"){ $('#cname_yf').val(c); $('#complany_yf').val(id); } $('#choose_complany').modal('hide'); }) $('#next_p').click(function(){ varpageNo=parseInt($('#more_tip').attr('data-p'))+1; $('#more_tip').attr('data-p',pageNo); get_complanys(); }) $('#pre_p').click(function(){ varpageNo=parseInt($('#more_tip').attr('data-p'))-1; if(pageNo>0){ $('#more_tip').attr('data-p',pageNo); get_complanys(); } }) functionsub(){ varj=$.trim($('#complany_jf').val()); vary=$.trim($('#complany_yf').val()); if(j.length==0){ alert('请选择甲方');returnfalse; } if(y.length==0){ alert('请选择乙方');returnfalse; } if(j==y){ alert('甲方和乙方不可以是同一家企业');returnfalse; } returntrue; } </script></body></html>5.3.5用户信息管理模块该模块主要实现用户信息的增加、修改、删除与查询功能。如下图所示：图5-3-5用户信息管理模块核心代码如下：<%@pagelanguage="java"contentType="text/html;charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPEhtml><htmllang="en"><head><%@includefile="common.jsp"%></head><body><!--Leftcolumn--><divclass="templatemo-flex-row"><%@includefile="left.jsp"%><!--Maincontent--><divclass="templatemo-contentcol-1light-gray-bg"><%@includefile="top.jsp"%><divclass="templatemo-content-container"><divclass="col-1"><divclass="panelpanel-defaultmargin-10"><divclass="panel-heading"><h2class="text-uppercase">企业用户管理</h2></div><divclass="panel-body"><formclass="form-inline"action="${ctxf}/complany/page2"method="post"role="form"> <divclass="form-group"> <labelclass="sr-only">企业名称</label> <inputtype="cname"name="cname"value="${ame}"class="form-control"placeholder="企业名称"> </div> <c:iftest="${roleeq'admin'}"> <divclass="form-group"> <labelclass="sr-only">状态</label> <selectname="status_"class="form-control"> <optionvalue="">-状态-</option> <optionvalue="0"<c:iftest="${o.status_eq'0'}">selected="selected"</c:if>>禁用</option> <optionvalue="1"<c:iftest="${o.status_eq'1'}">selected="selected"</c:if>>启用</option> </select> </c:if> </div> <buttontype="submit"class="btnbtn-default">查找</button> </form></div></div></div><divclass="panelpanel-defaulttemplatemo-content-widgetwhite-bgno-paddingtemplatemo-overflow-hidden"><divclass="panel-headingtemplatemo-position-relative"><h2class="text-uppercase">用户表</h2></div><divclass="table-responsive"><tableclass="tabletable-stripedtable-bordered"><thead><tr><td>企业名称</td><td>手机号</td><td>注册时间</td><td>最近一次登录</td><td>状态</td><td>禁用原因</td><td>禁/启用时间</td><td>操作</td></tr></thead><tbody><c:forEachitems="${pageInfo.list}"var="t"><tr><td>${ame}</td><td>${t.mob