品牌管理(增刪改查)

? 1. 分頁查詢

? ? ? 關(guān)于分頁查詢,我們主要用到了兩個(gè)插件,一個(gè)是后臺(tái)的pageHepler,一個(gè)是前臺(tái)的pagination;對(duì)于pageHepler來說很好理解,就是一個(gè)封裝了一些分頁方法的工具類,我們?cè)谑褂脮r(shí),在執(zhí)行dao層的方法之前,new一個(gè)pageHepler對(duì)象,用它里面的一個(gè)startPage方法,里面?zhèn)魅氲氖钱?dāng)前頁碼和每頁顯示的記錄數(shù)(這兩個(gè)數(shù)據(jù)是前臺(tái)傳給后臺(tái)的),然后我們就執(zhí)行dao層的方法,需要注意的是我們需要一個(gè)強(qiáng)轉(zhuǎn):把查詢結(jié)果強(qiáng)轉(zhuǎn)成Page<TbBrand>對(duì)象,這樣一來后臺(tái)的分頁代碼就完成了;

? ? ? 接著是前臺(tái)使用的pagination插件,之前我們?cè)谇芭_(tái)處理分頁都是用異步請(qǐng)求來獲取一個(gè)對(duì)象,然后在對(duì)象中獲取我們想要的數(shù)據(jù),來完成分頁的展示;而現(xiàn)在我們有了這個(gè)插件所有的活都交給它了,我們只需要在js代碼中引入它,然后給它需要的參數(shù),它就會(huì)幫我們完成分頁.所以我們?cè)谇芭_(tái)首先要做的就是引入pagination組件,注意還要引入樣式;接著就需要配paginationConf分頁控件,在這之前我們要在表格后面引入paginationConf:<tm-pagination conf="paginationConf"></tm-pagination>,在配置分頁控件時(shí),特別注意的就是onChage這個(gè)屬性,這個(gè)就是我們能通過perPageOptions屬性來控制每頁顯示多少條記錄,所以當(dāng)我們修改時(shí)就要重新加載頁面,由于我們?cè)陂_始配置的當(dāng)前頁數(shù)和總記錄數(shù)(開始是隨便定義的,所以一定要傳入)是可能改變的(每頁顯示的條數(shù),控件能自己獲取控制),所以重新加載時(shí),我們要用findByPage的方法:傳入前頁碼和總記錄數(shù)(當(dāng)然我們可以把這個(gè)重新加載的方法提取出來,方便以后使用);然后就是定義分頁方法了,定義分頁方法也沒什么可說的,唯一要注意的就是,我們?cè)讷@取到響應(yīng)數(shù)據(jù)后,這個(gè)數(shù)據(jù)是map集合形式存在的,里面是記錄數(shù)據(jù)的集合和總的記錄數(shù)(int類型),所以在取數(shù)據(jù)時(shí),$scope.list取的是數(shù)據(jù)對(duì)象中的記錄數(shù)據(jù)集合,$scope.paginationConf.totalItems取得是總記錄數(shù)(這里就是重新給totalItems賦值);還有一點(diǎn):如果我們之前做了查詢所有的操作,記得把初始化方法去掉;這樣我們就完成了分頁查詢展示

? ? 2. 新建品牌

? ? ? 關(guān)于新增數(shù)據(jù),后臺(tái)代碼很容易,這里就不做過多的陳述,唯一注意的就是我們?cè)赾ontroller中在接收參數(shù)時(shí)要用 @Requestbody把json轉(zhuǎn)成對(duì)象;我們?cè)谇芭_(tái)需要做的就是定義一個(gè)保存數(shù)據(jù)的方法(就是把前臺(tái)的新建的數(shù)據(jù)發(fā)送給后臺(tái)),然后就是把這個(gè)方法通過ng-click綁定給新建按鈕,通過ng-model把編輯窗口的屬性值傳遞給$scope,還有就是為了下一次新建不會(huì)顯示上一次的數(shù)據(jù),我們?cè)谛陆ò粹o上綁定了一個(gè)ng-click='entity={}',這樣就完成了新增品牌

? ? ? 為了不讓添加的數(shù)據(jù)重復(fù),我們可以增加一個(gè)findByName的方法,再執(zhí)行添加方法之前,進(jìn)行判斷:判斷根據(jù)這個(gè)對(duì)象的名字查詢的品牌對(duì)象是不是為null,為null可以添加,不為null提示用戶已經(jīng)存在了(再這之前最好再加上非空判斷,看看傳進(jìn)來的對(duì)象是不是有name和firstChar值,沒有就提示用戶)

? ? 3. 修改

? ? ? 修改相對(duì)于麻煩一點(diǎn),麻煩就在于它是要發(fā)起兩次請(qǐng)求:一次是我們點(diǎn)擊修改按鈕,需要后臺(tái)查詢數(shù)據(jù),把數(shù)據(jù)展示在編輯窗口;還有一次就是我們修改結(jié)束,點(diǎn)擊保存會(huì)把修改數(shù)據(jù)保存起來.所以我們后臺(tái)應(yīng)該有兩個(gè)方法,一個(gè)是根據(jù)id(唯一主鍵)查詢品修改數(shù)據(jù);另一個(gè)就是修改的方法

? ? ? 前臺(tái)首先需要在修改按鈕上綁定一個(gè)findOne的方法(這個(gè)方法需要傳入id),這樣點(diǎn)擊修改就會(huì)把數(shù)據(jù)展示在編輯窗口;

? ? ? 最后就是把數(shù)據(jù)把存在保存起來了,這里用了一個(gè)投巧的方法,就是我們的新建也是要用保存方法(前臺(tái)的保存),也是因?yàn)楸４姘粹o只能綁定一個(gè)方法.所以我們?cè)诒４娣椒ㄖ?先判斷傳入的對(duì)象的id是不是空的(因?yàn)閕d自增的,新建不用傳id),如果不是空的就用后臺(tái)的update方法,是空的就用后臺(tái)的save方法;這樣修改就完成了

? ? 4. 刪除

? ? ? 刪除后臺(tái)的代碼是很簡單的,就不說了;

? ? ? 前臺(tái)麻煩的就在于處理input選擇框:定義updateSelection方法,這個(gè)方法倒是好寫,但是要處理input的選中和取消選中.我們要的效果是選中時(shí)id會(huì)被傳入,取消時(shí)就會(huì)把對(duì)應(yīng)的id取出來;所以我們首先定義了一個(gè)數(shù)組,然后通過$event(input復(fù)選框的源)的target(就是獲取的input)可以獲取整個(gè)input的屬性,然后把checked(是否選中)判斷一下,如果選中就把id(復(fù)選框綁定方法時(shí)需要傳入)通過push加載數(shù)組中;沒有選中或者是取消了選中,我們能確定的是這個(gè)id是在數(shù)組中的,所以首先用indexOf確定它的索引位置,再用splice(有兩個(gè)參數(shù),一個(gè)是要?jiǎng)h除的元素位置,第二個(gè)是從這個(gè)元素起要?jiǎng)h除幾個(gè),我們只需要?jiǎng)h除一個(gè)就設(shè)置為1)方法把這個(gè)id移除,這樣就達(dá)到了我們想要的效果;然后就定義刪除方法就OK了

? ? ? 出于代碼的嚴(yán)謹(jǐn)性,我們想在用戶選中品牌,點(diǎn)擊刪除按鈕時(shí),彈出提示框,提示用戶要?jiǎng)h除品牌的名字,詢問是不是要?jiǎng)h除,點(diǎn)擊確定刪除,取消不刪除:這個(gè)功能的實(shí)行首先需要我們?cè)趇nput框綁定updateSelection方法時(shí)把品牌的名字一起穿過來,注意要在updateSelection方法里面加上,name的數(shù)組的賦值與刪除取消的name;然后就是在刪除方法里面,邏輯還沒執(zhí)行就用confirm提示用戶是不是刪除name數(shù)組里面的品牌,confirm返回的是一個(gè)boolean值.所以我們就可以根據(jù)這個(gè)boolean值做判斷,是true表示確定刪除,執(zhí)行刪除方法,是false就什么都不做就行了

? ? 5. 根據(jù)條件查詢

? ? ? 根據(jù)條件查詢就是在分頁查詢的基礎(chǔ)上加上了查詢條件,需要注意的就是我們?cè)诤笈_(tái)用到了代碼生成器中的Example,它的使用要注意一下;還有就是在添加條件之前先判斷一下name和first是不是空的,這樣可以防止空指針,是空的就還不用添加這個(gè)條件了

? ? ? 前臺(tái)唯一注意的就是要修改我們提取的刷新頁面的方法,把它調(diào)用的findOne方法換成search方法