目錄TOC\o"1-3"\h\u引言 11.1 模塊開發的意義 11.2 開發環境 1技術概述 22.1數據庫介紹 22.2設計中JavaScript和Ajax技術 22.3SpringMVC介紹 2需求分析 33.1項目概述 33.1.1應用目標 33.1.2作用及范圍 33.2模塊功能 33.3設計模式選定 3設計與實現 44.1數據庫設計 44.1.1E/R圖 4如下圖4-1所示： 44.1.2詳細的表結構 54.2流程圖 54.3模塊功能界面 64.3.1登錄界面 64.3.2管理員注冊界面 74.3.3管理員修改密碼界面 74.3.4用戶列表界面 84.3.5消費列表界面 84.3.6銷售列表界面 94.4部分功能界面代碼 94.4.1管理員注冊界面代碼 94.4.2頁面加載數據代碼 104.4.3SpringMVC配置代碼 12總結 17參考文獻 18致謝 19引言模塊開發的意義IT技術的發展使信息的管理也進入了一個嶄新的階段，人類進入了信息高速發展的時代，信息技術成為一門新的產業[1]。汽車銷售理念的出臺，使銷售信息管理系統已開始設計并應用于現實管理中。汽車銷售數量急劇增加，有關購車客戶的各種信息量也成倍增長，客戶信息的統計跟蹤工作量與工作難度亦在增長。使用計算機對客戶信息進行統計跟蹤，具有手工管理無法比擬的優點。使用計算機進行管理具有查找方便、數據處理快捷、成本低等優點。這些優點能夠極大地提高汽車銷售客戶信息管理的效率，也是企業的科學化、正規化管理的重要條件。在傳統模式下簡單利用計算機對客戶信息進行統計跟蹤，存在著較多的缺點，這給汽車銷售管理者對客戶的信息管理帶來了很大困難，嚴重影響了工作者的工作效率。隨著科學技術的不斷發展，計算機科學日漸成熟，使用日趨成熟的計算機技術代替傳統的人工模式，來實現銷售客戶的現代化管理，其強大的功能已經為人們所深刻認知，計算機技術已進入人類社會的各個領域并發揮著越來越重要的作用。開發環境運行環境硬件：P4以上計算機，256M內存以上。軟件要求：Windows98以上，Mysql5.5以上，JDK1.6以上，Tomcat7.0。開發環境硬件：P4以上計算機，256M內存以上。軟件：MySQL5.5，JDK1.7以上，Tomcat7.0，Eclipse3.6。技術概述2.1數據庫介紹MySQL[2]是一個小型關系型數據庫管理系統。由于它的強大功能、靈活性、豐富的應用編程接口（API）以及精巧的系統結構，體積小、速度快、總體擁有成本低，尤其是開放源碼，受到了廣大自由軟件愛好者甚至是商業軟件用戶的青睞，特別是與Apache和PHP/PERL結合，為建立基于數據庫的動態網站提供了強大動力。MySQL是一個真正的多用戶、多線程SQL數據庫服務器。SQL（結構化查詢語言）是世界上最流行的和標準化的數據庫語言。MySQL是以一個客戶機/服務器結構的實現，它由一個服務器守護程序MySQL和很多不同的客戶程序和庫組成。2.2設計中JavaScript和Ajax技術本模塊前臺的大部分功能采用Ajax來實現。這使系統大大提升了性能。Ajax技術以JavaScript[3]為依托，而JavaScript是一種解釋性的，基于對象的腳本語言（aninterpreted，object-basedscriptinglanguage）。HTML網頁在互動性方面能力較弱，例如表單局部刷新，就是用戶點擊某一按鈕時，可實現網頁的無跳轉的頁面局部刷新，用純HTML網頁無法實現；又如驗證HTML表單（Form）提交信息的有效性，用戶名不能為空，密碼不能少于6位，郵政編碼只能是數字之類，用純HTML網頁也無法實現。要實現這些功能，就需要用到JavaScript。JavaScript作為一種腳本語言，比HTML要復雜，但是因為JavaScript寫的程序都是以源代碼的形式出現的，正因為可以借鑒、參考優秀網頁的代碼，所以讓JavaScript本身也變得非常受歡迎，從而被廣泛應用。原來不懂編程的人，多參考JavaScript示例代碼，也能很快上手。JavaScript主要是基于客戶端運行的，用戶點擊帶有JavaScript的網頁，網頁里的JavaScript就傳到瀏覽器，由瀏覽器對此作處理。前面提到的局部刷新、驗證表單有效性等大量互動性功能，都是在客戶端完成的。2.3SpringMVC介紹Spring[4]框架提供了構建Web應用程序的全功能MVC模塊。使用Spring可插入的MVC架構，可以選擇是使用內置的SpringWeb[5]框架還是Struts這樣的Web框架。通過策略接口，Spring框架是高度可配置的，而且包含多種視圖技術，例如JavaServerPages（JSP）技術、Velocity、Tiles、iText和POI。SpringMVC框架并不知道使用的視圖，所以不會強迫您只使用JSP技術。SpringMVC分離了控制器、模型對象、分派器以及處理程序對象的角色，這種分離讓它們更容易進行定制。Spring用到的技術主要是IOC和AOP[6]，并且善用注解和單元測試。需求分析3.1項目概述該模塊是為節省了客戶管理花費的人力和物力，解決手工操作帶來的諸多不便，提高信息查詢管理的工作效率而設計的。3.1.1應用目標系統界面簡潔，操作方便、容易，最大限度的滿足汽車銷售管理人員的需求，使管理人員通過使用本模塊可以進行快速的客戶信息檢索，以節省大量的工作時間和工作量，提高客戶信息管理的效率。3.1.2作用及范圍本系統適用于汽車銷售系統中客戶信息查詢管理，使查詢更加方便、高效率，以協助企業建立完備的客戶信息的管理。3.2模塊功能汽車銷售管理平臺分為用戶管理，客戶基本信息的管理，管理員管理等幾大部分。其中客戶基本信息的管理模塊是核心模塊，客戶添加有單個添加，客戶信息查詢可以提供根據客戶姓名和購車名稱的精確查詢和根據購車價格，購車日期，有無等條件模糊查詢。其中，根據客戶的消費記錄，實現了汽車的銷量統計和客戶的消費統計。3.3設計模式選定目前，網絡應用軟件運行的模式主要有兩類：Client/Server模式和Browser/Web模式[7]。前者主要的缺點是維護、升級較麻煩，后者是近幾年伴隨Internet迅速發展起來的一種技術，它與客戶/服務器方式類似，客戶端是一個標準的瀏覽器，服務器端是WebServer,而WebServer與數據庫和應用服務器的緊密結合，使得這種模式的應用范圍不斷擴大，它已不僅僅用于網上查詢，有很多部門的業務系統、企業的MIS系統紛紛采用這種模式，它的主要優點是便于擴充應用、升級維護簡便。另外，客戶統計跟蹤模塊也將不斷的更新，同時軟件產品本身就要經過一個不斷自我完善的過程。基于上述考慮，用Browser/Web模式來設計管理系統比較合適，服務器端本模塊采用MySQL數據庫系統和J2EE框架來構成畢業統計跟蹤模塊；客戶端采用瀏覽起來完成。設計與實現4.1數據庫設計4.1.1E/R圖管理員編號用戶名密碼類型如下圖4-1所示：管理員編號用戶名密碼類型11用戶編號用戶名用戶性別用戶年齡購車日期車名購車價格用戶電話備注用戶身份證用戶地址圖4-1數據庫E/R圖4.1.2詳細的表結構系統數據庫名稱：car_sale_db。數據庫的表：car_admin，car_user。當添加刪除、選擇、更新、添加操作更新客戶表時對應的客戶人數發生變化對應的表car_user更新數據。系統管理員表結構如下表4-2所示：表4-2管理員表字段名稱數據類型長度編號int11用戶名varchar20密碼varchar20類型varchar50客戶表結構如下表4-3所示：表4-3用戶表字段名稱數據類型長度編號int11用戶名字varchar20用戶性別varchar10用戶年齡integer11購車日期varchar40購車名字varchar20購車價格integer11用戶電話varchar20用戶身份證varcahr20用戶地址varchar50備注varchar2004.2流程圖系統主要分為兩大模塊：管理員登錄模塊和客戶信息管理模塊。下面分別介紹管理員登錄模塊和客戶管理模塊的建立。如下圖4-4所示：汽車銷售客戶管理管理員客戶管理登錄注冊修改密碼用戶列表銷售列表消費列表圖4-4客戶管理系統組成結構4.3模塊功能界面4.3.1登錄界面登錄界面，系統管理員的登錄界面。如果賬號或密碼錯誤則提示紅色錯誤信息。如下圖4-5所示：圖4-5登陸界面4.3.2管理員注冊界面管理員注冊界面。如下圖4-6所示：圖4-6注冊界面4.3.3管理員修改密碼界面管理員修改密碼界面。如下圖4-7所示：圖4-7管理員修改密碼界面4.3.4用戶列表界面客戶信息的展示，客戶的增刪改操作，其中可進行模糊查找，也可以進行精確查找。如下圖4-8所示：圖4-8客戶信息列表界面4.3.5消費列表界面客戶的消費信息列表界面，可通過客戶名對客戶進行精確查找，如下圖4-9所示：圖4-9消費列表界面4.3.6銷售列表界面汽車的銷售信息列表界面，可通過車名對銷售信息進行精確查找，如下圖4-10所示。圖4-10銷售列表的顯示界面4.4部分功能界面代碼4.4.1管理員注冊界面代碼管理員注冊信息界面主要實現的是通過Ajax實現異步驗證要注冊的用戶名是否存在。通過jquery[8]來驗證密碼和確認密碼是否相等。該界面的具體代碼如下：<script>//驗證用戶名是否已經注冊，用到了Ajax異步調用 functionisUserExist(){ varuser=$("#user").val(); if($.trim(user)!=""){ $.post("/admin/isUserExist",{user:user},function(data){ if(data==0){ $("#user").val(""); $("#errorMsg").empty(); $("#errorMsg").append("用戶名已注冊"); }elseif(data==1){ $("#errorMsg").empty(); } }); }else{ $("#errorMsg").empty();$("#errorMsg").append("用戶名不能為空"); } }//通過Ajax來提交表單數據并進行注冊，實現與服務器端的交互$(":button").click(function(){varuser=$("#user").val();varpwd=$("#pwd").val();varconpwd=$("#conpwd").val();if($.trim(pwd)==""){ $("#pwd").val(""); $("#conpwd").val(""); $("#errorMsg").empty();$("#errorMsg").append("密碼不能為空");return;}if($.trim(pwd)==$.trim(conpwd)){ $.post("/admin/regist",{user:user,pwd:pwd},function(data){ if(data==1){ window.location.href="/admin/toLogin"; }elseif(data==0){ $("#user").val(""); $("#pwd").val(""); $("#conpwd").val(""); $("#errorMsg").empty(); $("#errorMsg").append("用戶名已注冊"); } });}else{ $("#pwd").val(""); $("#conpwd").val(""); $("#errorMsg").empty();$("#errorMsg").append("密碼不一致");}})</script>4.4.2頁面加載數據代碼頁面中加載數據的方式是通過EasyUI[9]中datagrid加載的，其可實現分頁Pagination的效果。$(function(){user.init();});varuser={ init:function(){user.loaddata(); }, loaddata:function(){//jquery獲取頁面中對應的參數值 varqueryName=$("#queryName").val(); varqueryCarName=$("#queryCarName").val(); varqueryCarPriceMin=$("#queryCarPriceMin").val(); varqueryCarPriceMax=$("#queryCarPriceMax").val(); varqueryDateMin=$('#queryDateMin').datebox('getValue'); varqueryDateMax=$('#queryDateMax').datebox('getValue');//easyui框架中對應的datagrid數據加載 $("#table-user").datagrid({ url:'/user/queryAllUser', toolbar:'#toolbar', pagination:true, rownumbers:true, fitColumns:true, singleSelect:true, fit:true,// toolbar:'toolbar', queryParams:{ queryName:queryName, queryCarName:queryCarName, queryCarPriceMin:queryCarPriceMin, queryCarPriceMax:queryCarPriceMax, queryDateMin:queryDateMin, queryDateMax:queryDateMax }, columns:[ [ {filed:'id',hidden:true}, {field:'userName',title:'用戶名',width:100}, {field:'carName',title:'車名',align:'left',width:100}, {field:'carPrice',title:'車價',width:100}, {field:'userCell',title:'用戶電話',width:100}, {field:'userAddress',title:'用戶地址',width:100}, {field:'carDate',title:'購車日期',width:100}, {field:'op',title:'操作',width:100,formatter:function(value,rec){ return'<atitle="刪除"href="javascript:user.del('+rec.id+')"class="easyui-linkbuttonl-btnl-btn-plain"iconcls="icon-remove"plain="true"><spanclass="l-btn-left"><spanclass="l-btn-texticon-removel-btn-icon-left"></span></span></a>'+ '<atitle="編輯"href="javascript:user.updateDialog('+rec.id+')"class="easyui-linkbuttonl-btnl-btn-plain"iconcls="icon-edit"plain="true"><spanclass="l-btn-left"><spanclass="l-btn-texticon-editl-btn-icon-left"></span></span></a>'; } } ] ] }); }4.4.3SpringMVC配置代碼配置中，涉及到了注解的配置，前臺展示使用freemarker[10]渲染也需要在這里進行配置，數據源的配置，連接數據庫使用的Mybatis也在這里進行相應的配置。<beansxmlns="/schema/beans"xmlns:context="/schema/context"xmlns:mvc="/schema/mvc"xmlns:xsi="/2001/XMLSchema-instance"xmlns:aop="/schema/aop"xmlns:tx="/schema/tx"xsi:schemaLocation="/schema/beans/schema/beans/spring-beans-3.0.xsd/schema/context/schema/context/spring-context.xsd/schema/tx/schema/tx/spring-tx-3.0.xsd/schema/aop/schema/aop/spring-aop-3.0.xsd/schema/mvc/schema/mvc/spring-mvc-3.0.xsd"><!--aopsupport--><mvc:annotation-driven/><aop:aspectj-autoproxy/><!--scanannotationbeans:Controller,Service,Component,Repository...--><context:component-scanbase-package="com.stu.car.dao.**,com.stu.car.service.**,com.stu.car.controller.**"/><!--靜態資源文件<context:property-placeholderlocation="classpath:perties"></context:property-placeholder>--><!--freemarker的配置--><beanid="freemarkerConfigurer"class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer"><propertyname="templateLoaderPath"value=""/><propertyname="defaultEncoding"value="UTF-8"/><propertyname="freemarkerSettings"><props><propkey="classic_compatible">true</prop><propkey="template_update_delay">10</prop><propkey="locale">zh_CN</prop><propkey="datetime_format">yyyy-MM-ddHH:mm:ss</prop><propkey="date_format">yyyy-MM-dd</prop><propkey="number_format">#.##</prop></props></property></bean><!--FreeMarker視圖解析如返回userinfo。。在這里配置后綴名ftl和視圖解析器。。--><beanid="viewResolver"class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver"><propertyname="viewClass"value="org.springframework.web.servlet.view.freemarker.FreeMarkerView"/><propertyname="prefix"value="/WEB-INF/template/"/><propertyname="suffix"value=".ftl"/><propertyname="contentType"value="text/html;charset=UTF-8"/><propertyname="exposeRequestAttributes"value="true"/><propertyname="exposeSessionAttributes"value="true"/><propertyname="exposeSpringMacroHelpers"value="true"/></bean><!--databaseconfiguration--><tx:annotation-driventransaction-manager="txManager"/><beanid="txManager"class="org.springframework.jdbc.datasource.DataSourceTransactionManager"><propertyname="dataSource"ref="dataSource"/></bean><beanid="dataSource"class="mons.dbcp.BasicDataSource"><propertyname="driverClassName"value="${jdbc.driver}"></property><propertyname="url"value="${jdbc.url}"></property><propertyname="username"value="${jdbc.username}"></property><propertyname="password"value="${jdbc.password}"></property><propertyname="maxActive"value="100"></property><propertyname="maxIdle"value="30"></property><propertyname="maxWait"value="500"></property><propertyname="defaultAutoCommit"value="true"></property></bean><!--ConfigureSqlSessionFactoryBean.--><beanid="sqlSessionFactory"class="org.mybatis.spring.SqlSessionFactoryBean"><propertyname="dataSource"ref="dataSource"/><propertyname="configLocation"value="classpath:mybatis.xml"/><propertyname="mapperLocations"value="classpath*:com/stu/car/dao/**/*.xml"/></bean><beanid="sqlSession"class="org.mybatis.spring.SqlSessionTemplate"><constructor-argindex="0"ref="sqlSessionFactory"/></bean><beanclass="org.mybatis.spring.mapper.MapperScannerConfigurer"><propertyname="basePackage"value="com.stu.car.dao.**"/><propertyname="sqlSessionTemplateBeanName"value="sqlSession"/></bean></beans>4.4.2后臺數據庫部分代碼用戶表增刪改查的簡單sql操作。<?xmlversion="1.0"encoding="UTF-8"?><!DOCTYPEmapperPUBLIC"-////DTDConfig3.1//EN""/dtd/mybatis-3-mapper.dtd"><mappernamespace="com.stu.car.dao.user.UserMapper"> <insertid="addUser"parameterType="com.stu.car.domain.user.User" useGeneratedKeys="true"keyProperty="id"><!--添加用戶代碼--> insertintocar_user ( user_name, user_sex, user_age, car_date, car_name, car_price, user_cell, user_ID, user_address, comment ) values ( #{userName}, #{userSex}, #{userAge}, #{carDate}, #{carName}, #{carPrice}, #{userCell}, #{userID}, #{userAddress}, #{comment} ) </insert><!--選擇所有用戶代碼--> <selectid="findAllUser"resultType="com.stu.car.domain.user.User"parameterType="com.stu.car.domain.user.UserQueryVO"> select idASid, user_nameASuserName, user_sexASuserSex, user_ageASuserAge, car_dateAScarDate, car_nameAScarName, car_priceAScarPrice, user_cellASuserCell, user_IDASuserID, user_addressASuserAddress, commentAScomment from car_user where1=1 <iftest="queryName!=nullandqueryName!=''"> ANDuser_name=#{queryName} </if> <iftest="queryCarName!=nullandqueryCarName!=''"> ANDcar_name=#{queryCarName} </if> <iftest="queryCarPriceMin!=nullandqueryCarPriceMax!=0"> ANDcar_price>=#{queryCarPriceMin}AND#{queryCarPriceMax}>=car_price </if> <iftest="queryDateMin!=nullandqueryDateMin!=''"> ANDcar_date>=#{queryDateMin}AND#{queryDateMax}>=car_date </if> limit#{offset},#{rows} </select><!--根據id刪除用戶--> <deleteid="deleteUserById"parameterType="int"> deletefromcar_user whereid=#{id} </del