1.創建項目,搭建環境
-
引入所需依賴
<dependencies> <!--Junit--> <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId> <version>4.12</version> </dependency> <!--數據庫驅動--> <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</artifactId> <version>5.1.47</version> </dependency> <!-- 數據庫連接池 --> <dependency> <groupId>com.mchange</groupId> <artifactId>c3p0</artifactId> <version>0.9.5.2</version> </dependency> <!--Servlet - JSP --> <dependency> <groupId>javax.servlet</groupId> <artifactId>servlet-api</artifactId> <version>2.5</version> </dependency> <dependency> <groupId>javax.servlet.jsp</groupId> <artifactId>jsp-api</artifactId> <version>2.2</version> </dependency> <dependency> <groupId>javax.servlet</groupId> <artifactId>jstl</artifactId> <version>1.2</version> </dependency> <!--Mybatis--> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis</artifactId> <version>3.5.2</version> </dependency> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis-spring</artifactId> <version>2.0.2</version> </dependency> <!--Spring--> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-webmvc</artifactId> <version>5.1.9.RELEASE</version> </dependency> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-jdbc</artifactId> <version>5.1.9.RELEASE</version> </dependency> <dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <version>1.18.16</version> </dependency> <!-- 上傳組件包 --> <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.3.1</version> </dependency> <dependency> <groupId>commons-io</groupId> <artifactId>commons-io</artifactId> <version>2.4</version> </dependency> <dependency> <groupId>commons-logging</groupId> <artifactId>commons-logging</artifactId> <version>1.1.1</version> </dependency> <dependency> <groupId>com.github.pagehelper</groupId> <artifactId>pagehelper</artifactId> <version>5.1.2</version> </dependency> <dependency> <groupId>jsptags</groupId> <artifactId>pager-taglib</artifactId> <version>2.0</version> </dependency> <dependency> <groupId>redis.clients</groupId> <artifactId>jedis</artifactId> <version>2.9.0</version> </dependency> <dependency> <groupId>com.alipay.sdk</groupId> <artifactId>alipay-sdk-java</artifactId> <version>3.4.49.ALL</version> </dependency> <dependency> <groupId>org.apache.solr</groupId> <artifactId>solr-core</artifactId> <version>3.5.0</version> </dependency> <dependency> <groupId>org.apache.solr</groupId> <artifactId>solr-solrj</artifactId> <version>3.5.0</version> </dependency> <dependency> <groupId>commons-codec</groupId> <artifactId>commons-codec</artifactId> <version>1.9</version> </dependency> <dependency> <groupId>commons-httpclient</groupId> <artifactId>commons-httpclient</artifactId> <version>3.1</version> </dependency> <dependency> <groupId>org.apache.httpcomponents</groupId> <artifactId>httpclient</artifactId> <version>4.2.5</version> </dependency> <dependency> <groupId>org.apache.httpcomponents</groupId> <artifactId>httpcore</artifactId> <version>4.2.4</version> </dependency> <dependency> <groupId>org.slf4j</groupId> <artifactId>jcl-over-slf4j</artifactId> <version>1.6.1</version> </dependency> <dependency> <groupId>log4j</groupId> <artifactId>log4j</artifactId> <version>1.2.17</version> </dependency> <dependency> <groupId>com.gitee.qdbp.thirdparty</groupId> <artifactId>ueditor</artifactId> <version>1.4.3.3</version> </dependency> <!-- 導入dbcp的jar包,用來在applicationContext.xml中配置數據庫 --> <dependency> <groupId>commons-dbcp</groupId> <artifactId>commons-dbcp</artifactId> <version>1.2.2</version> </dependency> <!-- JSTL標簽類 --> <dependency> <groupId>jstl</groupId> <artifactId>jstl</artifactId> <version>1.2</version> </dependency> <!-- mybatis物理分頁插件 --> <dependency> <groupId>com.github.miemiedev</groupId> <artifactId>mybatis-paginator</artifactId> <version>1.2.15</version> </dependency> <!-- 引入JSON --> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-databind</artifactId> <version>2.9.5</version> </dependency> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-annotations</artifactId> <version>2.9.5</version> </dependency> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-core</artifactId> <version>2.9.5</version> </dependency> <dependency> <groupId>org.codehaus.jackson</groupId> <artifactId>jackson-core-asl</artifactId> <version>1.9.13</version> </dependency> <dependency> <groupId>org.codehaus.jackson</groupId> <artifactId>jackson-mapper-asl</artifactId> <version>1.9.13</version> </dependency> <dependency> <groupId>org.aspectj</groupId> <artifactId>aspectjweaver</artifactId> <version>1.8.5</version> </dependency> <dependency> <groupId>cglib</groupId> <artifactId>cglib</artifactId> <version>3.1</version> </dependency> <!-- mybatis物理分頁插件 --> <dependency> <groupId>com.github.miemiedev</groupId> <artifactId>mybatis-paginator</artifactId> <version>1.2.15</version> </dependency> </dependencies>
-
搭建ssm框架
具體細節見:ssm框架整合。
注!:spring-mybatis中的數據庫連接池中的url中添加:&allowMultiQueries=true。
具體見:https://www.cnblogs.com/jiabowenn/articles/15391419.html
2.搭建mvc三層架構
-
pojo(Manage,ItemCategory)
- 使用lombok,根據數據庫字段創建對象屬性
-
dao
- ManageMapper:
- interface ManageMapper extends BaseDao
- .xml
- 創建通用sql片段,方便后期復用
- 實現ManageMapper interface
- interface ManageMapper extends BaseDao
- ManageMapper:
-
service
- service接口,繼承BaseService;serviceImpl實現service接口,並且繼承BaseSeriviceImpl類
- 在serviceImpl類中創建屬性ManageMapper和get方法,並且注入到spring中
-
service層和dao層測試
-
我是在寫mapper.xml的時候,邊寫邊測試。完成mapper測試后發現,這個可以在寫完service層之后一起測,一次就可以搞定。
-
測試代碼示例1:mapper測試
/*測試批量修改*/ @Test public void test10(){ ApplicationContext context = new ClassPathXmlApplicationContext("spring-dao.xml"); ManageMapper managerMapper = context.getBean("manageMapper", ManageMapper.class); ArrayList<Manage> manages = new ArrayList<Manage>(); for (int i = 10; i <= 19; i++) { manages.add(new Manage(i,"admin_" + i + i,"00000" + i + i,"realName_" + i + i)); } managerMapper.updateBatch(manages); for (Manage manage : manages) { System.out.println(manage); } }
-
測試代碼示例2:service測試
@Test public void test1(){ ApplicationContext context = new ClassPathXmlApplicationContext("applicationContext.xml"); ManageService manageService = context.getBean("manageServiceImpl", ManageService.class); List<Manage> manages = manageService.listAll(); for (Manage manage : manages) { System.out.println(manage); } }
-
controller:
- 在進行下面步驟的時候,一定要確保環境沒有問題。
3.登錄及相關功能的實現
-
管理員登錄:首先在ManageController.java中添加@Controller注解,並在@RequestMapping()中配置此類的統一訪問路徑
登錄訪問地址:http://localhost:8080/shuiguoshop/login/login
/*管理員登陸前*/ @RequestMapping("/login") public String login(){ return "/login/mLogin";}
前端顯示代碼(簡化版):只有一個form表單...
<form action="${ctx}/login/tologin" method="post"> <div class="panel login-box"> <div class="text-center margin-big padding-big-top"><h1>管理員登錄</h1></div> <div class="panel-body" style="padding: 30px;padding-bottom: 10px; padding-top: 10px;"> <div class="form-group"> <div class="field field-icon-right"> <input type="text" class="input input-big" name="userName" value="admin" placeholder="登錄賬號" data-validate="required:請填寫賬號" /> <span class="icon icon-user margin-small"></span> </div> </div> <div class="form-group"> <div class="field field-icon-right"> <input type="password" class="input input-big" name="passWord" value="111111" placeholder="登錄密碼" data-validate="required:請填寫密碼" /> <span class="icon icon-key margin-small"></span> </div> </div> </div> <div style="padding: 30px;"> <input type="submit" class="button button-block bg-main text-big input-big" value="登錄" /> </div> </div> </form>
-
管理員登錄驗證:接收從前端傳來的用戶名和密碼,通過getByEntity進行查找。如果查詢成功,跳轉到管理員后台界面;失敗,將查詢對象置空,並重定向到“退出登錄功能(/outManage)”
/*登錄驗證*/ @RequestMapping("/tologin") public String tologin(Manage manage, Model model){ Manage byEntity = manageService.getByEntity(manage); if (byEntity == null){ return "redirect:/login/outManage"; } model.addAttribute("manage",byEntity); return "/login/mIndex"; }
-
退出登錄
將manage對象設置為空
4.管理員后台管理界面-類目管理功能
4.1類目管理
執行流程:
-
點擊鏈接
-
訪問:findBySql
-
通過sql查詢出符合條件的Pager對象
@RequestMapping("/findBySql") public String findBySql(Model model,ItemCategory itemCategory){ String sql = "select * from item_category where isDelete = 0 and pid is null order by id"; Pager<ItemCategory> pagers = itemCategoryService.findBySqlRerturnEntity(sql); model.addAttribute("pagers",pagers); model.addAttribute("obj",itemCategory); return "itemCategory/itemCategory"; }
-
將查詢出的對象傳遞給前端的顯示界面(前端需要添加分頁功能)
前端分頁具體實現(這個分頁具體怎么寫還有待后續研究QwQ)
<tr>
<td colspan="8">
<div class="pagelist">
<!--分頁開始-->
<pg:pager url="${ctx}/itemCategory/findBySql" maxIndexPages="5" items="${pagers.total}"
maxPageItems="15" export="curPage=pageNumber">
<pg:last>
共${pagers.total}條記錄,共${pageNumber}頁
</pg:last>
當前第${curPage}頁
<pg:first>
<a href="${pageUrl}">首頁</a>
</pg:first>
<pg:prev>
<a href="${pageUrl}">上一頁</a>
</pg:prev>
<pg:pages>
<c:choose>
<c:when test="${curPage eq pageNumber}">
<font color="red">[${pageNumber}]</font>
</c:when>
<c:otherwise>
<a href="${pageUrl}">${pageNumber}</a>
</c:otherwise>
</c:choose>
</pg:pages>
<pg:next>
<a href="${pageUrl}">下一頁</a>
</pg:next>
<pg:last>
<c:choose>
<c:when test="${curPage eq pageNumber}">
<font color="red">尾頁</font>
</c:when>
<c:otherwise>
<a href="${pageUrl}">尾頁</a>
</c:otherwise>
</c:choose>
</pg:last>
</pg:pager>
</div>
</td>
</tr>
4.2新增類目
執行流程:點擊“新增目錄” --->addItem(controller)--->add(頁面)--->填好表單后提交,提交地址為:exAdd
點擊新增類目跳轉到類目添加頁面
<div>
<span>新增類目</span>
</div>
<form action="${ctx}/itemCategory/exAdd" method="post">
請輸入一級類目名稱:<input type="text" name="name" required>
<input type="submit">
</form>
controller:
/*添加一級類目執行*/
@RequestMapping("/exAdd")
public String exAdd(ItemCategory itemCategory){
System.err.println(itemCategory.getName());
itemCategory.setIsDelete(0);
itemCategoryService.insert(itemCategory);
return "redirect:/itemCategory/findBySql";
}
4.3一級類目修改
執行流程:
-
點擊按鈕,跳轉到itemCategory/updete,並且將該對象的id傳回后端
-
后端的:“/update” 接收到id,並且根據id查詢出該對象(load(Integer id))
@RequestMapping("/update") public String update(Model model,Integer id){ ItemCategory obj = itemCategoryService.load(id); model.addAttribute("obj",obj); return "itemCategory/update"; }
-
將該對象傳回前端頁面
-
前端頁面接收對象名和id(隱藏域中)
<form action="${ctx}/itemCategory/exUpdate" method="post"> <input type="hidden" name="id" value="${obj.id}"> 一級類目名稱:<input type="text" name="name" value="${obj.name}" required> <input type="submit" value="修改"> </form>
-
對象名顯示在文本框中,id放在隱藏域中(給下一步,根據id修改對象提供參數id)
-
提交表單后,“exUpdate”接收到前端數據:id 和 修改后的類目名
-
執行修改操作,之后重定向回findBySql。(之前findBySql一直寫成fingBySql,所以導致重定向失敗)
/*修改一級分類功能*/ @RequestMapping("/exUpdate") public String exUpdate(ItemCategory itemCategory){ itemCategoryService.updateById(itemCategory); return "redirect:/itemCategory/findBySql"; }
4.4一級類目刪除
執行流程:
-
點擊刪除,跳轉到“/delete”,並將要刪除的對象的id傳向后端
-
在/delete中,首先,通過id搜索到該對象(load),並將isDelete屬性置為1。
-
通過sql,將該類目下的所有二級類目isDelete屬性都置為1
-
重定向回findBySql
@RequestMapping("/delete") public String delete(Integer id){ ItemCategory load = itemCategoryService.load(id); load.setIsDelete(1); //刪除本身 itemCategoryService.updateById(load); //將下級也刪除 String sql = "update item_category set isDelete = 1 where pid =" + id; itemCategoryService.updateBysql(sql); return "redirect:/itemCategory/findBySql"; }
4.5查看二級類目:
執行流程:
-
點擊查看二級目錄,將該類的id作為pid傳向后端
-
通過查詢,得到pager對象
-
將pager對象傳遞回前端頁面進行分頁顯示
/* * 分頁查詢類目列表2 * */ @RequestMapping("/findBySql2") public String findBySql2(Model model,ItemCategory itemCategory){ String sql = "select * from item_category where isDelete = 0 and pid = " + itemCategory.getPid() + " order by id"; Pager<ItemCategory> pagers = itemCategoryService.findBySqlRerturnEntity(sql); model.addAttribute("pagers",pagers); model.addAttribute("obj",itemCategory); return "itemCategory/itemCategory2"; }
4.6新增二級類目功能
執行流程:
-
點擊新增二級目錄,將該二級目錄的pid傳回后端,並跳轉到新增界面
<div> <a href="${ctx}/itemCategory/add2?pid=${obj.pid}" style="padding-left: 10px">新增二級類目</a> </div>
/** * 轉向到新增二級目錄 */ @RequestMapping("/add2") public String add2(Integer pid, Model model){ model.addAttribute("pid",pid); return "itemCategory/add2"; }
-
add2.jsp接收pid,儲存在隱藏域中
<form action="${ctx}/itemCategory/exAdd2?pid=${pid}" method="post"> <input type="hidden" name="pid" value="${obj.pid}"> 請輸入二級類目名稱:<input type="text" name="name" required> <input type="submit" value="添加"> </form>
-
填好二級類目名稱后,將名稱與pid作為對象一同傳遞回”exAdd2“.
- 將該對象isDelete有null置為0
- 將該對象插入表中
- 重定向回”itemCategory/findBySql2?pid=“
/** * 新增二級類目執行 */ @RequestMapping("/exAdd2") public String exAdd2(ItemCategory itemCategory){ itemCategory.setIsDelete(0); itemCategoryService.insert(itemCategory); System.err.println(itemCategory.toString()); return "redirect:/itemCategory/findBySql2?pid=" + itemCategory.getPid(); }
4.78二級類目修改,刪除
與之前一級類目修改刪除相似,再次不再過多贅述。