========================================後臺管理系統==================================================

管理人員可以在這裡釋出商品，檢視訂單等等操作

  商品管理

* 帶條件查詢商品，通過boostrap的分頁外掛展示商品列表

* 建立商品，新增商品的資訊以及必須上傳五張照片用來展示商品效果

* 編輯商品

* 刪除商品

1.上傳圖片

* form表單的method="post" enctype="multipart/form-data"

* 用於接收表單元素所提交引數的處理器方法的形參型別為 MultipartFile 陣列，且必須使用註解@RequestParam 修飾

* 處理器方法中形參名字必須和表單中的name屬性一致

        * 要想判斷是否上傳的圖片為空，不能用== null來判斷，必須用isEmpty(),因為系統會為每一個表單元素建立物件

* 向資料庫中儲存圖片，儲存的是圖片在專案中所在資料夾的地址，這樣讀取時可以直接訪問

2.表單驗證

* 提交表單的時候又想保留原來表單提交的方式，還想處理後臺返回的資訊，可以使用ajaxForm

	$(function(){
		
		// 點選報存按鈕提交表單
		$("#saveProductBtn").click(function(){
			
			$("#productForm").prop("action","product/saveProduct.do");
			$("#productForm").submit();
		});
		
		// ajaxForm配置完,並不會真正的提交,而是要等到submit()事件,才會提交
		$("#productForm").ajaxForm({
			
			//clearForm:true, //提交成功後清空所有表單欄位值(包括文字域,但是檔案不會清空)
			//dataType:json,
			//type:"POST",
			resetForm:true, //表示成功提交後重置所有欄位
			beforeSubmit:function(){ // 在提交前進行表單驗證
				
				if(!checkProductNo() || !checkTitle() || !checkPrice() || !checkPhotos()){
					return false;
				}
				
				return true;
			},
			success:function(data){
				if(data.success){
					$("#message").text("儲存成功");
					window.location.href = "${pageContext.request.contextPath}/product/index.do";
				}else{
					$("#message").text("儲存失敗");
				}
			}
		});	
		
	});
 

* 但是要注意的一點是，在有檔案控制元件提交時，ajaxForm會自動過濾掉上傳為空的控制元件。

  比如說總共有五個檔案控制元件，使用者只給三個控制元件選擇了上傳內容,通過ajaxForm傳到後臺的只有三個，但是通過原始Form傳到

後臺的有五個。所以在這樣的情況下，我們必須使用原始的form表單。

  驗證可以在表單中有一個type="submit"的按鈕，form 屬性定義onsubmit="return 方法名()；"

3.批量選擇資料

除了直接拼接，下面的方法用到陣列的特性

// 定義一個數組
var array = [];
$o.each(function(){
	// 向陣列中新增元素
	array.push(this.value);
})
// 通過分隔符將陣列中的元素拼接成一個字串
var data = "ids=" + array.join("&ids=");
 

========================================前端購物平臺==================================================

展示給使用者的頁面,使用者可以瀏覽商品新增購物車結算付款

1.頁面之間的跳轉

除了首頁(展示商品的主頁面)之外，其餘的頁面為了保護資料的安全性均放在WEB-INF下，所以頁面之間的跳轉需要通過controller來實現

2.從哪個頁面點選登入或註冊連結，操作成功後重新回到原來的頁面，需要將當前頁面的url傳給處理器

// 給"註冊"按鈕繫結單擊事件
$("#registerCustomerBtn").click(function(){	
	// 獲得當前URL
	var returnURL = window.location.href;
	window.location.href ="${pageContext.request.contextPath}/portal/main/register.do?returnURL="+returnURL;	
});	

3.新增購物車

這是最重要的一部分，業務上分為兩種情況，使用者在不登入和登入的狀態下都可以將商品新增到購物車

首先分析的是不登入的狀態：

遊客不登入，就不能將購物車狀態記錄到資料庫中，所以如何保留資料狀態是問題的關鍵。這時候我們想到的是cookie，

將資料儲存到瀏覽器本地。那麼如何儲存？購物車中的資訊包括兩部分，一部分是商品的詳細資訊，一部分是購買商品的數量。

所以將關鍵的商品標識和購買數量以"商品標識1-購買數量，商品標識2-購買數量，...."的形式儲存到cookie中。

有了思路，就是如何去實現？

由於對cookie的操作很繁瑣，所以以下操作可以寫到一個工具類中，方便呼叫：

* 新增商品操作

遊客在點選某一商品新增到購物車時，首先需要得到本地cookie的值，檢視本商品是否已經在cookie中。

（1）如果在，那麼直接更新該商品標識的數量即可。

（2）如果不在，就直接向cookie中新增該商品標識的資訊即可

* 刪除商品操作

得到cookie，找到該商品標識的鍵值對，清空即可

* 修改商品數量操作

得到cookie，找到對應商品標識，更新數量

* 統計購物車商品總數量

得到cookie，遍歷將數量相加，將總數量放到session中

* 展示cookie中的購物車

拿到cookie中的商品標識去資料庫中查詢詳細資訊

得到新拼接好的cookie響應給瀏覽器

其次分析的是登入狀態：

也分為兩種情況：

（1）使用者註冊

遊客在瀏覽商品過程中突然有了購買意向，將商品加入購物車去註冊新賬號，由於是新使用者，所以購物車表中肯定沒

有該使用者的資料，但是要得到cookie的值，判斷是否為空：

-----為空：不做處理，直接註冊成功

-----不為空：需要將cookie中的商品標識插入到購物車表中

（2）使用者登入

得到cookie的值，判斷是否為空

-----為空：不做處理，直接登入成功

-----不為空：判斷cookie中的商品標識是否已經存在購物車表中

---------如果存在：將cookie中的數量加上原來購物車中的數量更新

---------如果不存在：將該商品標識的資料插入到購物車中

得到購物車中商品總數量：由於每次會將cookie中的值更新到資料庫中，所以直接查詢資料庫計算總數即可。

展示購物車中的商品：直接查詢該使用者的購物車表

其他邊邊角角的問題：

a）Dao層有多個字串型別的引數，不封裝Map，如何應用？

Integer selectCountOfShoppingCart(@Param("customerId") Integer customerId, @Param("status") String status);

b） 對於一些在多個類中經常用到的變數，可以定義成系統常量，這樣如果發生變動，只需要改一處即可

public class ApplicationConstant {
	
	/**
	 * 將使用者資訊儲存到session作用域的常量
	 */
	public static final String SESSION_CUSTOMER = "session_customer";
	
	/**
	 * cookie中關於購物車的標識
	 */
	public static final String COOKIE_SHOPCART = "cookie_shopcart";
	
	/**
	 * 購物車中商品總數量
	 */
	public static final String COUNTOFSHOPCART = "count_of_shopcart";
}

c）前臺對於有無使用者session的購物車數量展示可以通過jstl標籤

<c:choose>
	<c:when test="${not empty session_customer}">
		。。。。。
	</c:when>
			
	<c:otherwise> 
		。。。。。
 	</c:otherwise>     
</c:choose>

d）重新整理當前頁面

location.replace(location);

if($(".shoppingBox table tr:visible").length == 0){
	alert("沒有商品可以結算");
	return;
}

<!-- 查詢使用者標識下購物車的總數量 -->
<select id="selectCountOfShoppingCart" resultType="int">
	select 
		ifnull(sum(purchaseCount),0)
	from tbl_shopping_cart
	where 
		customerId = #{customerId} and status = #{status}
</select>

g）回退

onclick="window.history.back(-1);"