楚璃轩

第十一天-购物车订单系统的实现

- 1 购物车功能
- - 1.1 功能说明
  - 1.2 功能分析
  - 1.3 添加购物车商品
  - - 1.3.1 service
    - - CartItem.java
      - CartService.java
      - CartServiceImpl.java
    - 1.3.2 controller
    - - CartController.java
    - 1.3.3 添加购物车成功页面
    - - cartSuccess.jsp
      - base.css
      - initcart20150123.css
      - 测试
  - 1.4 展示购物车商品
  - - 1.4.1 server
    - - CartService.java
      - CartServiceImpl.java
    - 1.4.2 controller
    - - CartController.java
      - 测试
      - cart.jsp
      - CartController.java
  - 1.5 修改商品数量
  - - cart.jsp
    - cart.js
  - 1.6 删除购物车商品
  - - 1.6.1 server
    - - CartService.java
      - CartServiceImpl.java
    - 1.6.2 controller
    - - CartController.java
      - 测试
    - 1.7 购物车存在的问题
- 2 订单系统实现
- - 2.1 订单表结构
  - - 订单表tb_order
    - 订单商品表：tb_order_item
    - 物流表：tb_order_shipping
  - 2.2订单系统功能
  - 2.3 taotao-order
  - - 2.3.1 框架整合
    - - SqlMapConfig.xml
      - db.properties
      - resource.properties
      - applicationContext-dao.xml
      - applicationContext-jedis.xml
      - applicationContext-service.xml
      - applicationContext-trans.xml
      - springmvc.xml
      - pom.xml
      - web.xml
  - 2.4 创建订单接口
  - - 2.4.1 接口说明
    - 2.4.2 dao
    - 2.4.3 server
    - - OrderService.java
      - OrderServiceImpl.java
      - resource.properties
    - 2.4.4 controller
    - - Order.java
      - OrderController.java
- 3 前端系统实现下单功能
- - 3.1下单流程
  - 3.2 购物车“去结算”按钮
  - - cart.jsp
    - OrderController.java
  - 3.3 订单确认界面
  - - 3.3.1要求用户登录
    - - springmvc.xml
    - 3.3.2 根据用户ID查询用户的收货地址列表
    - 3.3.3 在此页面展示购物车的商品列表
    - - OrderController.java
      - order-cart.jsp
  - 3.4 提交订单
  - - 3.4.1 需求分析
    - - order-cart.jsp
    - 3.4.2 server
    - - Order.java
      - OrderService.java
      - OrderServiceImpl.java
      - resource.properties
    - 3.4.3 controller
    - - OrderController.java

1 购物车功能

1.1 功能说明

1、商品加入购物车时，不是必须要求登录。

2、计算购物车中商品的总价。当商品数量发生变化时需要重新计算。

3、用户可以删除购物车中的商

4、用户下单后，删除购物车的功能。

1.2 功能分析

1、在用户不登陆的清空下也可以使用购物车，那么就需要把购物车信息放入cookie中。

2、可以把商品信息，存放到pojo中，然后序列化成json存入cookie中。

3、取商品信息可以从cookie中把json数据取出来，然后转换成java对象即可。

4、此功能只需要操作cookie不需要数据库的支持，所以只需要在taotao-portal中实现即可。

5、购物车分有四种动作

a) 添加商品

b) 修改商品数量

c) 删除购物车中的商品

d) 展示购物车商品列表

1.3 添加购物车商品

1.3.1 service

功能：

1、接收controller传递过来的商品id，根据商品id查询商品信息。

2、从cookie中取出购物车信息，转换成商品pojo列表。

3、把商品信息添加到商品列表中。

参数：

1、商品id

2、Request

3、response

返回值：

TaoTaoResult

CartItem.java

/taotao-portal/src/main/java/com/taotao/portal/pojo/CartItem.java

创建购物车商品pojo:

package com.taotao.portal.pojo;

public class CartItem {

	private long id;
	private String title;
	private Integer num;
	private long price;
	private String image;
	
	
	public long getId() {
		return id;
	}
	public void setId(long id) {
		this.id = id;
	}
	public String getTitle() {
		return title;
	}
	public void setTitle(String title) {
		this.title = title;
	}
	public Integer getNum() {
		return num;
	}
	public void setNum(Integer num) {
		this.num = num;
	}
	public long getPrice() {
		return price;
	}
	public void setPrice(long price) {
		this.price = price;
	}
	public String getImage() {
		return image;
	}
	public void setImage(String image) {
		this.image = image;
	}
}

CartService.java

/taotao-portal/src/main/java/com/taotao/portal/service/CartService.java

package com.taotao.portal.service;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.taotao.common.utill.TaotaoResult;
/**
 * 购物车
 * @author Lenovo
 *
 */
public interface CartService {
	/**
	 * 添加购物车商品
	 * @param itemId
	 * @param num
	 * @return
	 */
	TaotaoResult addCartItem(long itemId,int num,HttpServletRequest request, HttpServletResponse response);
}

CartServiceImpl.java

/taotao-portal/src/main/java/com/taotao/portal/service/impl/CartServiceImpl.java

package com.taotao.portal.service.impl;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;

import com.taotao.common.utill.CookieUtils;
import com.taotao.common.utill.HttpClientUtil;
import com.taotao.common.utill.JsonUtils;
import com.taotao.common.utill.TaotaoResult;
import com.taotao.pojo.TbItem;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 * 购物车Service
 * Title: CartServiceImpl
 * Description: 
 * Company: www.itcast.com 
 * @author	入云龙
 * @date	2015年9月15日下午2:39:19
 * @version 1.0
 */
@Service
public class CartServiceImpl implements CartService{
	
	@Value("${REST_BASE_URL}")
	private String REST_BASE_URL;
	@Value("${ITEM_INFO_URL}")
	private String ITEM_INFO_URL;
	

	/**
	 * 添加购物车商品
	 * Title: addCartItem
	 * Description: 
	 * @param itemId
	 * @param num
	 * @return
	 * @see com.taotao.portal.service.CartService#addCartItem(long, int)
	 */
	@Override
	public TaotaoResult addCartItem(long itemId, int num, 
			HttpServletRequest request, HttpServletResponse response) {
		//取商品信息
		CartItem cartItem = null;
		//取购物车商品列表
		List itemList = getCartItemList(request);
		//判断购物车商品列表中是否存在此商品
		for (CartItem cItem : itemList) {
			//如果存在此商品
			if (cItem.getId() == itemId) {
				//增加商品数量
				cItem.setNum(cItem.getNum() + num);
				cartItem = cItem;
				break;
			}
		}
		if (cartItem == null) {
			cartItem = new CartItem();
			//根据商品id查询商品基本信息。
			String json = HttpClientUtil.doGet(REST_BASE_URL + ITEM_INFO_URL + itemId); 
			//把json转换成java对象
			TaotaoResult taotaoResult = TaotaoResult.formatToPojo(json, TbItem.class);
			if (taotaoResult.getStatus() == 200) {
				TbItem item = (TbItem) taotaoResult.getData();
				cartItem.setId(item.getId());
				cartItem.setTitle(item.getTitle());
				cartItem.setImage(item.getImage() == null ? "":item.getImage().split(",")[0]);
				cartItem.setNum(num);
				cartItem.setPrice(item.getPrice());
			}
			//添加到购物车列表
			itemList.add(cartItem);
		}
		//把购物车列表写入cookie
		CookieUtils.setCookie(request, response, "TT_CART", JsonUtils.objectToJson(itemList), true);
		
		return TaotaoResult.ok();
	}
	/**
	 * 从cookie中取商品列表
	 * Title: getCartItemList
	 * Description: 
	 * @return
	 */
	private List getCartItemList(HttpServletRequest request) {
		//从cookie中取商品列表
		String cartJson = CookieUtils.getCookieValue(request, "TT_CART", true);
		if (cartJson == null) {
			return new ArrayList<>();
		}
		//把json转换成商品列表
		try {
			List list = JsonUtils.jsonToList(cartJson, CartItem.class);
			return list;
		} catch (Exception e) {
			e.printStackTrace();
		}
		return new ArrayList<>();
	}
	
	
	@Override
	public List getCartItemList(HttpServletRequest request, HttpServletResponse response) {
		List itemList = getCartItemList(request);
		return itemList;
	}
	/**
	 * 删除购物车商品
	 * Title: deleteCartItem
	 * Description: 
	 * @param itemId
	 * @return
	 * @see com.taotao.portal.service.CartService#deleteCartItem(long)
	 */
	@Override
	public TaotaoResult deleteCartItem(long itemId, HttpServletRequest request, HttpServletResponse response) {
		//从cookie中取购物车商品列表
		List itemList = getCartItemList(request);
		//从列表中找到此商品
		for (CartItem cartItem : itemList) {
			if (cartItem.getId() == itemId) {
				itemList.remove(cartItem);
				break;
			}
				 
		}
		//把购物车列表重新写入cookie
		CookieUtils.setCookie(request, response, "TT_CART", JsonUtils.objectToJson(itemList), true);
		
		return TaotaoResult.ok();
	}
	
	

}

1.3.2 controller

接受商品id和商品数量，商品数量如果为空默认为1，调用service向购物车添加商品。展示添加成功的页面

CartController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/CartController.java

package com.taotao.portal.controller;


import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.service.CartService;

/**
 * 购物车Controller
 * 
 */
@Controller
@RequestMapping("/cart")
public class CartController {

	@Autowired
	private CartService cartService;
	
	@RequestMapping("/add/{itemId}")
	public String addCartItem(@PathVariable Long itemId, 
			@RequestParam(defaultValue="1")Integer num, 
			HttpServletRequest request, HttpServletResponse response) {
		TaotaoResult result = cartService.addCartItem(itemId, num, request, response);
		return "cartSuccess";
	}
	
	
}

1.3.3 添加购物车成功页面

cartSuccess.jsp

/taotao-portal/src/main/webapp/WEB-INF/jsp/cartSuccess.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>











商品已成功加入购物车




    
	
	
		
			

				
				
				
				
				
					
						商品已成功加入购物车！
						商品数量有限，请您尽快下单并付款！
					
					 去购物车结算 您还可以 继续购物

base.css

/taotao-portal/src/main/webapp/css/base.css

/* 
 Copyright @ JD.COM 
 Date: 2014-09-23 3:24:26 [PM] 
 */
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
	pre, a, address, big, cite, code, del, em, font, img, ins, small,
	strong, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form,
	label, legend {
	margin: 0;
	padding: 0
}

ol, ul {
	list-style: none
}

:focus {
	outline: 0
}

a img {
	border: 0
}

img {
	vertical-align: middle
}

table {
	empty-cells: show
}

ins {
	text-decoration: none
}

del {
	text-decoration: line-through
}

em {
	font-style: normal
}

button::-moz-focus-inner, input[type=reset]::-moz-focus-inner, input[type=button]::-moz-focus-inner,
	input[type=submit]::-moz-focus-inner, input[type=file]>input[type=button]::-moz-focus-inner
	{
	border: 0;
	padding: 0
}

.red{
	color: red;
}

.g-0 {
	width: 100%
}

.g-8 {
	width: 150px
}

.g-a {
	width: 190px
}

.g-a1 {
	width: 210px
}

.g-a5 {
	width: 290px
}

.g-b1 {
	width: 410px
}

.g-b4 {
	width: 470px
}

.g-b8 {
	width: 550px
}

.g-b9 {
	width: 570px
}

.g-c9 {
	width: 770px
}

.g-d {
	width: 790px
}

.g-e {
	width: 990px
}

.g-0, .g-8, .g-a, .g-a1, .g-a5, .g-b1, .g-b4, .g-b8, .g-b9, .g-c9, .g-d,
	.g-e {
	float: left
}

.g-8, .g-a, .g-a1, .g-a5, .g-b1, .g-b4, .g-b8, .g-b9, .g-c9, .g-d, .g-e
	{
	position: relative;
	z-index: 1
}

.g-80, .c-80 {
	margin-left: 160px
}

.g-a0, .c-a0 {
	margin-left: 200px
}

.g-a10, .c-a10 {
	margin-left: 220px
}

.g-a50, .c-a50 {
	margin-left: 300px
}

.g-b10, .c-b10 {
	margin-left: 420px
}

.g-b40, .c-b40 {
	margin-left: 480px
}

.g-b80, .c-b80 {
	margin-left: 560px
}

.g-b90, .c-b90 {
	margin-left: 580px
}

.g-c90, .c-c90 {
	margin-left: 780px
}

.g-d0, .c-d0 {
	margin-left: 800px
}

.g-e0, .c-e0 {
	margin-left: 1000px
}

* html .g-80, * html .g-a0, * html .g-a10, * html .g-a50, * html .g-b10,
	* html .g-b40, * html .g-b80, * html .g-b90, * html .g-c90, * html .g-d0,
	* html .g-e0 {
	float: right;
	margin-left: 10px
}

.g-08, .c-08 {
	margin-right: 160px
}

.g-0a, .c-0a {
	margin-right: 200px
}

.g-0a1, .c-0a1 {
	margin-right: 220px
}

.g-0a5, .c-0a5 {
	margin-right: 300px
}

.g-0b1, .c-0b1 {
	margin-right: 420px
}

.g-0b4, .c-0b4 {
	margin-right: 480px
}

.g-0b8, .c-0b8 {
	margin-right: 560px
}

.g-0b9, .c-0b9 {
	margin-right: 580px
}

.g-0c9, .c-0c9 {
	margin-right: 780px
}

.g-0d, .c-0d {
	margin-right: 800px
}

.g-0e, .c-0e {
	margin-right: 1000px
}

* html .g-08, * html .g-0a, * html .g-0a1, * html .g-0a5, * html .g-0b1,
	* html .g-0b4, * html .g-0b8, * html .g-0b9, * html .g-0c9, * html .g-0d,
	* html .g-0e {
	float: left;
	margin-right: 10px
}

.c-0 {
	margin-left: -100%
}

.c-080 {
	margin-left: -150px
}

.c-0a0 {
	margin-left: -190px
}

.c-0a10 {
	margin-left: -210px
}

.c-0a50 {
	margin-left: -290px
}

.c-0b10 {
	margin-left: -410px
}

.c-0b40 {
	margin-left: -470px
}

.c-0b80 {
	margin-left: -550px
}

.c-0b90 {
	margin-left: -570px
}

.c-0c90 {
	margin-left: -770px
}

.c-0d0 {
	margin-left: -790px
}

.c-0e0 {
	margin-left: -990px
}

* html .c-0 {
	filter: ""
}

.fl {
	float: left
}

.fr {
	float: right
}

.fn {
	float: none
}

.al {
	text-align: left
}

.ac {
	text-align: center
}

.ar {
	text-align: right
}

.clr {
	display: block;
	overflow: hidden;
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 0
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden
}

.clearfix {
	display: inline-table
}

* html .clearfix {
	height: 1%
}

.clearfix {
	display: block
}

*+html .clearfix {
	min-height: 1%
}

.overflow {
	overflow: hidden
}

.m, .mt, .mc, .mb, .sm, .smt, .smc, .smb {
	overflow: hidden;
	zoom: 1
}

.m, .sm {
	margin-bottom: 10px
}

.mt, .smt {
	cursor: default
}

.mt h2, .smt h3 {
	font-family: "microsoft yahei"
}

.m .mt .extra a:link, .m .mt .extra a:visited, .sm .smt .extra a:link,
	.sm .smt .extra a:visited {
	color: #005EA7
}

.form label, .form input, .form select, .form textarea, .form button,
	.form .label {
	float: left;
	font-size: 12px
}

.block {
	display: block;
	overflow: hidden
}

.hide {
	display: none
}

.invisible {
	visibility: hidden
}

.tab {
	overflow: hidden;
	zoom: 1
}

.tab li, .tab a, .tab-item {
	float: left;
	text-align: center
}

.btn-img, .button {
	display: inline-block;
	margin: 0;
	padding: 0;
	border: 0;
	text-align: center;
	cursor: pointer
}

.btn-text {
	margin: 0;
	padding: 0;
	text-align: center;
	cursor: pointer
}

body {
	font: 12px/150% Arial, Verdana, "\5b8b\4f53";
	color: #666;
	background: #fff;
	_background-image: url(about:blank);
	_background-attachment: fixed
}

h1 {
	font: 20px "microsoft yahei", "\5b8b\4f53"
}

h2, h3 {
	font-size: 14px
}

h4, h5, h6 {
	font-size: 12px
}

a {
	color: #666;
	text-decoration: none
}

a:hover {
	color: #E4393C;
	text-decoration: underline
}

.w {
	width: 990px;
	margin: 0 auto
}

.w1 {
	margin-bottom: 10px
}

.root61 .w {
	width: 1210px
}

.lh {
	overflow: hidden;
	zoom: 1
}

.lh li, .lh dl, .lh .item {
	float: left
}

.ld {
	position: relative;
	zoom: 1
}

.ld s, .ld b, .ld .block {
	position: absolute;
	overflow: hidden
}

.p-img, .p-name, .p-price, .p-market, .p-detail {
	overflow: hidden
}

.p-img {
	padding: 5px 0
}

.p-img a:link, .p-img a:visited {
	text-decoration: none
}

.p-img .pi {
	cursor: pointer
}

.p-name, .p-detail {
	word-break: break-all;
	word-wrap: break-word
}

.p-price {
	color: #999
}

.p-price strong, .p-market strong {
	color: #E4393C
}

.pi {
	position: absolute;
	top: 0;
	right: 0;
	top: 10px;
	width: 52px;
	height: 40px;
	padding: 12px 0 0;
	background-image:
		url(../images/20130330C.png);
	background-repeat: no-repeat;
	font-family: "microsoft yahei";
	color: #fff;
	line-height: 31px;
	overflow: hidden;
	font-size: 16px;
	zoom: 1
}

.pix0 {
	background-position: 0 -40px
}

.pix1 {
	background-position: 0 -100px
}

.pif1 {
	font-size: 22px
}

.pif4 {
	width: 36px;
	height: 42px;
	padding-top: 10px;
	padding-left: 8px;
	padding-right: 8px;
	font-size: 14px;
	line-height: 16px
}

.pt {
	display: inline-block;
	overflow: hidden
}

.ptx1 {
	
}

img.err-product, img.err-poster {
	background: url(../images/error-jd.gif)
		no-repeat 50% 50%
}

img.err-price {
	width: 81px;
	height: 22px;
	background: url(../images/error-3.gif)
		no-repeat 50% 50%
}

.loading-style1 b, .loading-style2 {
	background: url(../images/loading-jd.gif)
		no-repeat 50% 50%
}

.loading-style1 {
	width: 126px;
	margin: 0 auto;
	text-align: center;
	color: #999
}

.loading-style1 b {
	display: block;
	width: 43px;
	height: 24px;
	margin: 0 auto 5px
}

.slide {
	position: relative;
	background: url(../images/loading-jd.gif)
		no-repeat center center
}

.slide .slide-itemswrap {
	position: relative;
	overflow: hidden
}

.slide .slide-items {
	position: absolute;
	overflow: hidden
}

.slide-controls span {
	display: inline-block;
	margin: 0 1px;
	background: #999;
	text-align: center;
	cursor: default;
	color: #fff;
	border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px
}

.slide-controls a:link, .slide-controls a:visited {
	display: inline-block;
	width: 100%;
	color: #fff;
	font-weight: 700
}

.slide-controls .curr {
	background: #E4393C
}

#toppanel {
	position: relative;
	z-index: 1000
}

#sidepanel {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 1000
}

#sidepanel a, #sidepanel b {
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#sidepanel a {
	display: block;
	position: relative;
	width: 17px;
	height: 66px;
	padding: 28px 4px 0;
	margin: 5px 0;
	text-align: center;
	line-height: 14px;
	text-decoration: none
}

#sidepanel b {
	position: absolute;
	top: 9px;
	left: 4px;
	width: 17px;
	height: 16px;
	overflow: hidden
}

#sidepanel a:link, #sidepanel a:visited {
	background-position: -85px -149px
}

#sidepanel a:hover, #sidepanel a:active {
	background-position: -50px -149px
}

#sidepanel .gotop:link b, #sidepanel .gotop:visited b {
	background-position: -21px -219px
}

#sidepanel .gotop:hover b, #sidepanel .gotop:active b {
	background-position: -21px -200px
}

#sidepanel .research:link b, #sidepanel .research:visited b {
	background-position: 0 -219px
}

#sidepanel .research:hover b, #sidepanel .research:active b {
	background-position: 0 -200px
}

* html #sidepanel {
	position: absolute;
	top: expression(documentElement.scrollTop +
		documentElement.clientHeight-this.offsetHeight);
	overflow: visible
}

.da0x150 {
	width: 310px;
	height: 150px;
	background: #efefef
}

.da0x100 {
	width: 310px;
	height: 100px;
	background: #efefef
}

.pagin a, .pagin span {
	float: left;
	height: 20px;
	padding: 3px 10px;
	border: 1px solid #ccc;
	margin-left: 2px;
	font-family: arial;
	line-height: 20px;
	font-size: 14px;
	overflow: hidden;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px
}

.pagin .text, .pagin .current {
	border: 0;
	padding: 4px 11px
}

.pagin a:link, .pagin a:visited {
	color: #005aa0
}

.pagin a:hover, .pagin a:active {
	background: #005aa0;
	color: #fff;
	text-decoration: none
}

.pagin .current, .pagin .current:link, .pagin .current:visited {
	color: #f60;
	font-weight: 700
}

.pagin b {
	display: block;
	position: absolute;
	top: 9px;
	width: 5px;
	height: 9px;
	background-image:
		url(../images/bg_hotsale.gif);
	background-repeat: no-repeat;
	overflow: hidden
}

.pagin .prev, .pagin .next, .pagin .prev-disabled, .pagin .next-disabled
	{
	position: relative;
	padding-top: 5px;
	height: 18px;
	line-height: 18px
}

.pagin .prev-disabled, .pagin .next-disabled {
	color: #ccc;
	cursor: default
}

.pagin .prev, .pagin .prev-disabled {
	padding-left: 12px
}

.pagin .prev b {
	left: 3px;
	background-position: -68px -608px
}

.pagin .prev-disabled b {
	left: 3px;
	background-position: -80px -608px
}

.pagin .next, .pagin .next-disabled {
	padding-right: 12px
}

.pagin .next b {
	right: 3px;
	background-position: -62px -608px
}

.pagin .next-disabled b {
	right: 3px;
	background-position: -74px -608px
}

.pagin-m a, .pagin-m span {
	height: 14px;
	line-height: 14px;
	font-size: 12px
}

.pagin-m b {
	top: 5px
}

.pagin-m .prev, .pagin-m .next, .pagin-m .prev-disabled, .pagin-m .next-disabled
	{
	padding-top: 3px;
	height: 14px;
	line-height: 14px;
	*line-height: 16px
}

.thickframe {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10000000;
	width: 100%;
	height: 100%;
	background: #000;
	border: 0;
	filter: alpha(opacity = 0);
	opacity: 0
}

.thickdiv {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10000001;
	width: 100%;
	height: 100%;
	background: #000;
	border: 0;
	filter: alpha(opacity = 15);
	opacity: .15
}

.thickbox {
	position: absolute;
	z-index: 10000002;
	overflow: hidden;
	padding: 0;
	border: 4px solid rgba(0, 0, 0, .1);
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px
}

.thicktitle {
	height: 27px;
	padding: 0 10px;
	border: solid #C4C4C4;
	border-width: 1px 1px 0;
	background: #F3F3F3;
	line-height: 27px;
	font-family: arial, "\5b8b\4f53";
	font-size: 14px;
	font-weight: 700;
	color: #333
}

.thickwrap .thicktitle {
	height: 31px;
	padding: 0 10px;
	background: #f5f5f5;
	line-height: 31px;
	font-family: arial, "\5b8b\4f53";
	font-size: 14px;
	font-weight: 700;
	color: #333;
	border: 0
}

.thickclose:link, .thickclose:visited {
	display: block;
	position: absolute;
	z-index: 100000;
	top: 7px;
	right: 12px;
	overflow: hidden;
	width: 15px;
	height: 15px;
	background:
		url(../images/bg_thickbox.gif)
		no-repeat 0 -18px;
	font-size: 0;
	line-height: 100px
}

.thickwrap .thickclose:link, .thickwrap .thickclose:visited {
	display: block;
	position: absolute;
	z-index: 100000;
	top: 5px;
	right: 10px;
	overflow: hidden;
	width: 21px;
	height: 21px;
	background:
		url(../images/thickbox_close.png)
		no-repeat 0 0;
	font-size: 0;
	line-height: 100px
}

.thickcon {
	overflow: auto;
	background: #fff;
	padding: 10px
}

.thickwrap {
	border: 1px solid #c4c4c4
}

.thickwrap .thickcon {
	background: 0
}

.thickwrap {
	border: 1px solid #c4c4c4;
	background: #fff
}

.thickloading {
	background: url(../images/loading-jd.gif)
		#fff no-repeat center center
}

.thickcountdown {
	height: 20px;
	padding-right: 6px;
	margin-top: -20px;
	text-align: right;
	color: #999
}

* html .thickframe {
	position: absolute
}

* html .thickdiv {
	position: absolute
}

#thicktitler {
	
}

#thickcloser:link, #thickcloser:visited {
	
}

#thickconr iframe {
	display: block
}

.compare {
	width: 200px;
	border: 1px solid #C4C4C4;
	background: #fff;
	display: none
}

.compare .mt {
	background: #F3F3F3;
	padding: 3px 5px;
	height: 18px;
	line-height: 18px;
	overflow: hidden;
	zoom: 1
}

.compare h5 {
	float: left
}

.compare .extra {
	float: right;
	margin-top: 2px;
	width: 13px;
	height: 13px;
	background:
		url(../images/bg_hotsale.gif)
		no-repeat -51px -632px;
	cursor: pointer
}

.compare .mc {
	padding: 2px
}

.compare .mc li {
	border: 1px solid #E5E5E5;
	padding: 4px 12px 4px 4px;
	margin-bottom: 2px
}

.compare .mb {
	text-align: center;
	padding: 5px 0
}

.compare .btn {
	cursor: pointer
}

.crumb {
	padding: 0 5px 8px
}

.breadcrumb {
	height: 20px;
	padding: 0 0 4px 6px;
	margin-bottom: 10px;
	overflow: hidden;
	line-height: 20px;
	vertical-align: baseline
}

.breadcrumb strong, .breadcrumb h1 {
	display: inline;
	font-weight: 700;
	line-height: 20px;
	font-size: 18px;
	font-family: "microsoft yahei"
}

.breadcrumb span {
	font-family: "\5b8b\4f53"
}

.iloading {
	width: 140px;
	height: 30px;
	padding-left: 22px;
	background: url(../images/loading.gif)
		no-repeat 0 center;
	margin: 0 auto;
	line-height: 30px;
	color: #999
}

.norecode {
	color: #999
}

.model-prompt .con {
	position: relative;
	zoom: 1
}

.model-prompt .con b {
	position: absolute;
	background-image:
		url(../images/bg_prompt.gif);
	background-repeat: no-repeat
}

#model-collect .con {
	padding: 20px 0 0 60px;
	color: #999
}

#model-collect .con a {
	text-decoration: underline;
	color: #999
}

#model-collect .success {
	top: 20px;
	left: 10px;
	width: 34px;
	height: 30px;
	background-position: 0 0
}

#model-collect .failed {
	top: 20px;
	left: 10px;
	width: 34px;
	height: 30px;
	background-position: 0 -32px
}

#css-error {
	display: none
}

.jtip {
	position: absolute;
	z-index: 3;
	padding: 4px 15px 4px 5px;
	background: #FFFCEE;
	border: 1px solid #F6E09C;
	-moz-box-shadow: 0 0 5px #DDD;
	-webkit-box-shadow: 0 0 5px #DDD;
	box-shadow: 0 0 5px #DDD
}

.jtip-content {
	color: #F60
}

.jtip-arrow {
	position: absolute;
	left: -5px;
	width: 5px;
	height: 16px;
	overflow: hidden
}

.jtip-arrow1 {
	position: absolute;
	top: 0;
	left: -8px;
	width: 0;
	height: 0;
	border-width: 8px;
	border-style: dashed solid dashed dashed;
	border-color: transparent #F6E09C transparent transparent;
	overflow: hidden
}

.jtip-arrow2 {
	position: absolute;
	top: 0;
	left: -7px;
	z-index: 1;
	width: 0;
	height: 0;
	border-width: 8px;
	border-style: dashed solid dashed dashed;
	border-color: transparent #FFFCEE transparent transparent;
	overflow: hidden
}

.jtip-close {
	position: absolute;
	top: 3px;
	right: 5px;
	line-height: 14px;
	cursor: pointer;
	font-size: 14px
}

#shortcut-2013 .fl b, #shortcut-2013 .fr b {
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#shortcut-2013, #shortcut-2013 .w {
	height: 30px;
	background: #F7F7F7
}

#shortcut-2013 {
	width: 100%;
	border-bottom: 1px solid #eee;
	line-height: 30px
}

#shortcut-2013 li {
	height: 30px;
	padding: 0 11px 0 12px
}

#shortcut-2013 li s {
	top: 9px;
	left: 0;
	width: 0;
	height: 12px;
	border-left: 1px solid #DDD;
	overflow: hidden
}

#shortcut-2013 b {
	transition: transform .2s ease-in 0s;
	-webkit-transition: -webkit-transform .2s ease-in 0s
}

#shortcut-2013 .fl {
	overflow: visible
}

#shortcut-2013 .fl .fore1 {
	padding-left: 16px;
	z-index: 13
}

#shortcut-2013 .fl b {
	top: 8px;
	left: 0;
	width: 13px;
	height: 13px;
	background: url(../images/20130725.png)
		no-repeat 0 0;
	cursor: pointer
}

#shortcut-2013 .fl li:hover b {
	transform: rotate(720deg);
	-webkit-transform: rotate(720deg)
}

#shortcut-2013 .fl .jtip {
	left: 68px;
	top: 6px;
	width: 120px;
	line-height: 16px
}

#shortcut-2013 .fr {
	height: 30px;
	overflow: visible
}

#shortcut-2013 .fr b {
	top: 13px;
	right: 8px;
	width: 7px;
	height: 4px;
	background-position: -95px -55px
}

#shortcut-2013 .menu {
	width: 60px;
	z-index: 12
}

#shortcut-2013 .dd {
	display: none
}

#shortcut-2013 .hover .outline, #shortcut-2013 .hover .dd {
	position: absolute;
	border: 1px solid #DDD;
	background: #fff;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	box-shadow: 0 0 10px rgba(0, 0, 0, .12)
}

#shortcut-2013 .hover .outline {
	z-index: -1;
	left: 5px;
	top: 3px;
	width: 73px;
	height: 28px
}

#shortcut-2013 .hover .blank {
	position: absolute;
	z-index: 1;
	top: 23px;
	left: 6px;
	width: 73px;
	height: 8px;
	overflow: hidden;
	background: #fff
}

#shortcut-2013 .hover .dd {
	display: block;
	top: 30px
}

#shortcut-2013 .fr .hover b {
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2)
}

#biz-service.hover .dd {
	left: 5px;
	width: 73px
}

#biz-service.hover .dd div {
	padding-left: 6px;
	line-height: 22px
}

#site-nav .dd {
	left: -172px;
	width: 250px
}

#site-nav .dd dt {
	padding: 4px 0 4px 9px;
	line-height: 20px;
	font-weight: 700
}

#site-nav .dd dl {
	float: none;
	width: auto
}

#site-nav .dd dl dd {
	margin: 0 9px;
	line-height: 22px;
	overflow: hidden;
	padding-bottom: 3px;
	border-bottom: 1px solid #f2f2f2;
	*zoom: 1
}

#site-nav .dd dl div {
	float: left;
	margin-right: 10px;
	display: inline
}

#site-nav .dd .fore3 dd {
	border-bottom: 0
}

#site-nav .dd .fore3 {
	padding-bottom: 4px
}

#site-nav .dd .fore1 div {
	width: 58px;
	margin-right: 0
}

#header-2013 {
	height: 60px;
	padding: 15px 0
}

#logo-2013 {
	float: left;
	width: 330px
}

#logo-2013 a:link b, #logo-2013 a:visited b {
	top: 12px;
	left: 168px;
	width: 100px;
	height: 38px;
	cursor: pointer
}

#logo-2013 a:hover b, #logo-2013 a:active b {
	display: none;
	background:
		url(../images/20130330A_2.png) #fff
		no-repeat 0 -312px
}

.root61 #logo {
	width: 350px
}

#search-2013 {
	float: left;
	width: 330px;
	padding: 4px 86px 0 0
}

#search-2013 input {
	margin: 0;
	padding: 0;
	height: 30px;
	border: 0
}

#search-2013 .i-search {
	z-index: 11;
	width: 304px;
	height: 30px;
	margin-bottom: 3px;
	border: 3px solid #E4393C
}

#search-2013 .form {
	height: 30px;
	overflow: hidden
}

#search-2013 .text {
	width: 216px;
	height: 20px;
	padding: 5px;
	background-position: 0 -360px;
	background-color: #fff;
	background-repeat: repeat-x;
	line-height: 20px;
	color: #999;
	font-family: arial, "\5b8b\4f53";
	font-size: 14px
}

#search-2013 .button {
	width: 78px;
	background: #E4393C;
	font-size: 14px;
	font-weight: 700;
	color: #fff
}

#search-2013 .text, #search-2013 .button {
	-webkit-appearance: none;
	-webkit-border-radius: 0
}

#search-2013 #shelper {
	overflow: hidden;
	position: absolute;
	top: 32px;
	left: -3px;
	width: 308px;
	border: 1px solid #E4393C;
	background: #fff;
	-moz-box-shadow: 0 0 5px #999;
	-webkit-box-shadow: 0 0 5px #999;
	box-shadow: 0 0 5px #999
}

#search-2013 #shelper li.close:hover {
	background: 0
}

#search-2013 .text:focus {
	background-color: #fcfcfc;
	-webkit-box-shadow: 2px 2px 3px #d2d2d2 inset;
	-moz-box-shadow: 2px 2px 3px #d2d2d2 inset;
	box-shadow: 2px 2px 3px #d2d2d2 inset
}

.root61 #search-2013 #shelper {
	width: 418px
}

#shelper li {
	overflow: hidden;
	padding: 1px 6px;
	line-height: 22px;
	cursor: pointer
}

#shelper .search-item {
	float: left;
	width: 190px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden
}

#shelper li.fore1 .search-item {
	width: 170px
}

#shelper .search-count {
	overflow: hidden;
	color: #aaa;
	text-align: right;
	*zoom: 1
}

#shelper .close {
	border-top: 1px solid #efefef;
	text-align: right
}

#shelper .item3 {
	cursor: default
}

#shelper .item3 a {
	float: left;
	margin-right: 10px;
	white-space: nowrap
}

#shelper li.fore1 {
	width: 100%;
	padding: 0;
	border-bottom: 1px solid #ddd
}

#shelper li.fore1 .item1 {
	float: none;
	width: auto;
	height: 22px;
	padding: 1px 2px 1px 20px;
	overflow: hidden;
	zoom: 1
}

#shelper li.fore1 div.fore1 {
	padding: 0 6px
}

#shelper li.fore1 strong {
	color: #C00
}

#shelper li.fore1 .fore1 strong {
	color: #333
}

#shelper li.fore1 .item1 {
	float: none;
	width: auto;
	padding: 1px 6px 1px 20px
}

#shelper li.fore1 .item2 {
	float: none;
	width: auto;
	padding: 1px 6px 1px 20px
}

#shelper li.fore1 .item3 {
	float: none;
	width: auto;
	color: #9C9A9C
}

#shelper li.fore1 span {
	float: left
}

#shelper li:hover {
	background: #FFDFC6
}

#shelper li.fore1:hover, #shelper li.close:hover {
	background: 0
}

#shelper li.fore1 div:hover {
	background: #FFDFC6
}

#shelper-2013 {
	overflow: hidden;
	position: absolute;
	top: 32px;
	left: -3px;
	width: 648px;
	padding: 10px 10px 10px 0;
	border: 1px solid #E4393C;
	background: #fff;
	-moz-box-shadow: 0 0 5px #999;
	-webkit-box-shadow: 0 0 5px #999;
	box-shadow: 0 0 5px #999
}

#shelper-2013 .i-shelper {
	overflow: hidden
}

#shelper-2013 .list-text {
	width: 312px;
	padding: 0 0 200px;
	margin-bottom: -200px;
	border-right: 1px solid #EEE
}

#shelper-2013 .list-text li {
	overflow: hidden;
	padding: 1px 15px 1px 10px;
	line-height: 22px;
	cursor: pointer;
	*zoom: 1
}

#shelper-2013 .list-text .search-item {
	float: left;
	width: 190px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden
}

#shelper-2013 .list-text li.fore1 .search-item {
	width: 190px
}

#shelper-2013 .list-text .search-count {
	overflow: hidden;
	color: #aaa;
	text-align: right
}

#shelper-2013 .list-text .item3 {
	cursor: default
}

#shelper-2013 .list-text .item3 a {
	float: left;
	margin-right: 10px;
	white-space: nowrap
}

#shelper-2013 .list-text li.fore1 {
	width: 100%;
	padding: 0;
	border-bottom: 1px solid #EEE
}

#shelper-2013 .list-text li.fore1 div.fore1 {
	padding: 0 15px 0 10px
}

#shelper-2013 .list-text li.fore1 strong {
	color: #E4393C
}

#shelper-2013 .list-text li.fore1 .fore1 strong {
	color: #333
}

#shelper-2013 .list-text li.fore1 .item1 {
	float: none;
	width: auto;
	padding: 1px 15px 1px 20px
}

#shelper-2013 .list-text li.fore1 .item2 {
	float: none;
	width: auto;
	padding: 1px 15px 1px 20px
}

#shelper-2013 .list-text li.fore1 .item3 {
	float: none;
	width: auto;
	color: #9C9A9C
}

#shelper-2013 .list-text li.fore1 span {
	float: left
}

#shelper-2013 .list-text .hover {
	background: #F3F3F3
}

#shelper-2013 .list-text .resultful {
	background-image: url(../images/8.png);
	background-repeat: no-repeat;
	background-position: 302px 8px
}

#shelper-2013 .list-word {
	width: 320px;
	padding-left: 4px;
	border-top: 1px solid #F1F1F1;
	padding: 8px 0;
	color: #999;
	font-family: "\5b8b\4f53"
}

#shelper-2013 .list-word strong {
	color: #E4393C
}

#shelper-2013 .list-word a:link, #shelper-2013 .list-word a:visited {
	float: left;
	white-space: nowrap;
	margin-right: 16px;
	color: #005EA7;
	text-decoration: underline
}

#shelper-2013 .list-img {
	width: 324px;
	padding-bottom: 8px
}

#shelper-2013 .list-img .item {
	width: 100px;
	border: 1px solid #fff;
	padding: 0 3px
}

#shelper-2013 .list-img .p-name {
	height: 3em
}

#shelper-2013 .list-img .p-price {
	color: #E4393C
}

#shelper-2013 .list-img .item:hover {
	border-color: #7ABD54
}

#shelper-2013 .list-word {
	padding-bottom: 0
}

#hotwords {
	height: 18px;
	color: #999;
	overflow: hidden
}

#hotwords span, #hotwords strong {
	float: left;
	font-weight: 400
}

#hotwords a:link, #hotwords a:visited {
	float: left;
	margin-right: 10px;
	color: #999
}

#hotwords a:hover, #hotwords a:active {
	color: #E4393C
}

.root61 #search-2013 {
	width: 510px;
	padding-right: 126px
}

.root61 #search-2013 .i-search {
	width: 494px
}

.root61 #search-2013 .text {
	width: 406px
}

#my360buy-2013 dt, #my360buy-2013 dl.hover dt {
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#my360buy-2013 {
	float: left;
	position: relative;
	z-index: 9;
	width: 106px;
	height: 30px;
	margin-top: 12px
}

#my360buy-2013 dt {
	position: absolute;
	z-index: 1;
	width: 50px;
	height: 30px;
	padding: 0 24px 0 30px;
	border: 1px solid #EFEFEF;
	background-position: -116px -24px;
	background-color: #F7F7F7;
	text-align: center;
	line-height: 27px;
	cursor: pointer;
	*line-height: 30px
}

#my360buy-2013 dt span {
	font-family: "\5b8b\4f53";
	color: #005EA7
}

#my360buy-2013 dt b {
	top: 12px;
	right: 8px;
	width: 0;
	height: 0;
	border-style: solid dashed dashed;
	border-width: 5px;
	border-color: #CCC transparent transparent;
	overflow: hidden
}

#my360buy-2013 dd {
	display: none;
	position: absolute;
	top: 32px;
	right: 0;
	width: 310px;
	border: 1px solid #E3E3E3;
	background: #fff
}

#my360buy-2013 dl.hover dt {
	height: 32px;
	border: 1px solid #E3E3E3;
	border-bottom: 0;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	background-position: -115px -53px;
	background-color: #fff
}

#my360buy-2013 dl.hover dd {
	display: block;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	box-shadow: 0 0 10px rgba(0, 0, 0, .12)
}

#my360buy-2013 dl.hover s {
	position: absolute;
	bottom: -10px;
	left: -10px;
	width: 114px;
	height: 10px;
	background: #fff
}

#my360buy-2013 dl.hover dt b {
	top: 7px;
	border-style: dashed dashed solid;
	border-color: transparent transparent #CCC
}

#my360buy-2013 .prompt a, #my360buy-2013 .orderlist a {
	color: #005EA7
}

#my360buy-2013 .prompt {
	padding: 6px 6px 6px 9px;
	border-bottom: 1px solid #EEE;
	line-height: 25px;
	overflow: hidden;
	zoom: 1
}

#my360buy-2013 .prompt .btn-login {
	display: block;
	width: 73px;
	height: 25px;
	text-align: center;
	line-height: 25px;
	background: #E4393C;
	color: #fff;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px
}

#my360buy-2013 .smt h4 {
	float: left;
	padding-left: 4px;
	font-weight: 400
}

#my360buy-2013 .smt .extra {
	float: left
}

#my360buy-2013 .orderlist {
	width: 300px;
	padding: 8px 5px;
	border-bottom: 1px solid #E6E6E6
}

#my360buy-2013 .orderlist li {
	overflow: hidden;
	border-top: 1px dotted #ccc;
	zoom: 1
}

#my360buy-2013 .orderlist .fore1 {
	border-top: 0
}

#my360buy-2013 .orderlist span {
	color: #F60
}

#my360buy-2013 .orderlist .p-img {
	padding-left: 4px
}

#my360buy-2013 .orderlist .p-img img, #my360buy-2013 .orderlist .more {
	float: left;
	border: 1px solid #ddd;
	margin-right: 3px
}

#my360buy-2013 .orderlist .more {
	width: 50px;
	height: 50px;
	background:
		url(../images/20130330A_2.png)
		no-repeat 0 -250px;
	overflow: hidden;
	line-height: 150px;
	margin-right: 0
}

#my360buy-2013 .orderlist .p-detail {
	padding-top: 2px
}

#my360buy-2013 .uclist {
	width: 310px;
	margin: 5px 0;
	overflow: hidden
}

#my360buy-2013 .uclist ul {
	width: 134px;
	padding: 0 10px
}

#my360buy-2013 .uclist .fore1 {
	border-right: 1px solid #F1F1F1
}

#my360buy-2013 .uclist a:link, #my360buy-2013 .uclist a:visited {
	display: block;
	height: 18px;
	overflow: hidden;
	padding: 5px;
	text-decoration: none;
	color: #005EA7
}

#my360buy-2013 .uclist a:hover, #my360buy-2013 .uclist a:active {
	background: #F5F5F5;
	color: #E4393C
}

#my360buy-2013 .viewlist {
	width: 305px;
	padding: 8px 0 8px 5px;
	background: #F3F3F3
}

#my360buy-2013 .viewlist span {
	padding-left: 4px
}

#my360buy-2013 .viewlist li {
	width: 52px;
	padding: 4px;
	line-height: 0;
	font-size: 0
}

#my360buy-2013 .viewlist a:link, #my360buy-2013 .viewlist a:visited {
	display: block;
	border: 1px solid #ddd
}

#my360buy-2013 .loading-style1 {
	margin: 10px auto
}

#settleup-2013 dt, #settleup-2013 dl.hover dt, #settleup-2013 .nogoods b
	{
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#settleup-2013 {
	float: right;
	position: relative;
	z-index: 9;
	width: 126px;
	height: 30px;
	margin-top: 12px
}

#settleup-2013 dt {
	position: absolute;
	z-index: 3;
	width: 74px;
	height: 30px;
	padding: 0 20px 0 30px;
	border: 1px solid #EFEFEF;
	background-position: -115px -84px;
	background-color: #F7F7F7;
	cursor: pointer;
	text-align: center
}

#settleup-2013 dt .shopping {
	position: absolute;
	top: -13px;
	left: 20px;
	background-image:
		url(../images/20130330A_2.png);
	background-position: -133px -279px;
	padding-left: 6px;
	color: #fff
}

#settleup-2013 dt .shopping span {
	float: left;
	display: block;
	height: 20px;
	padding-right: 6px;
	background-image:
		url(../images/20130330A_2.png);
	background-position: 100% -250px
}

#settleup-2013 dt a {
	line-height: 27px;
	*line-height: 30px
}

#settleup-2013 dt b {
	top: 9px;
	right: 4px;
	width: 0;
	height: 0;
	border-style: dashed dashed dashed solid;
	border-width: 5px;
	border-color: transparent transparent transparent #CCC;
	overflow: hidden
}

#settleup-2013 dd {
	display: none;
	position: absolute;
	top: 32px;
	right: 0;
	width: 350px
}

#settleup-2013 dl.hover dt {
	height: 32px;
	border: 1px solid #E3E3E3;
	border-bottom: 0;
	background-position: -115px -114px;
	background-color: #fff;
	-moz-box-shadow: 0 0 10px #DDD;
	-webkit-box-shadow: 0 0 10px #DDD;
	box-shadow: 0 0 10px #DDD
}

#settleup-2013 dl.hover s {
	position: absolute;
	bottom: -10px;
	left: -10px;
	width: 134px;
	height: 10px;
	background: #fff
}

#settleup-2013 dl.hover dd {
	display: block;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12);
	box-shadow: 0 0 10px rgba(0, 0, 0, .12)
}

#settleup-content {
	position: relative;
	left: 0;
	top: 0;
	z-index: 2;
	width: 350px;
	background: #fff
}

#settleup-iframe {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 350px;
	background: #000
}

#settleup-2013 .prompt {
	border: 1px solid #ddd;
	padding: 10px 15px;
	background: #fff
}

#settleup-2013 .nogoods {
	padding-left: 30px;
	height: 49px;
	line-height: 49px;
	overflow: hidden;
	color: #999
}

#settleup-2013 .nogoods b {
	float: left;
	width: 56px;
	height: 49px;
	background-position: 0 0
}

#settleup-2013 .sm {
	margin-bottom: 0
}

#settleup-2013 .smt {
	height: 25px;
	padding: 6px 8px;
	background-position: 0 -118px;
	background-repeat: repeat-x;
	border-style: solid;
	border-width: 1px;
	border-color: #DDD #DDD #EEE;
	line-height: 25px
}

#settleup-2013 .smt .extra {
	color: #999
}

#settleup-2013 .smc {
	border: solid #ddd;
	border-width: 0 1px;
	background: #fff;
	height: auto !important;
	height: 344px;
	max-height: 344px;
	overflow-y: auto
}

#settleup-2013 ul {
	margin-top: -1px
}

#settleup-2013 li {
	padding: 8px 10px;
	border-top: 1px dotted #ccc;
	overflow: hidden;
	line-height: 17px;
	vertical-align: bottom;
	*zoom: 1
}

#settleup-2013 li:hover, #settleup-2013 li.hover {
	background: #F5F5F5
}

#settleup-2013 .p-img {
	width: 50px;
	height: 50px;
	border: 1px solid #ddd;
	padding: 0;
	margin-right: 10px;
	font-size: 0
}

#settleup-2013 .p-name {
	width: 150px;
	height: 52px
}

#settleup-2013 .p-price {
	font-weight: 700
}

#settleup-2013 .delete {
	color: #005EA7
}

#settleup-2013 .smb {
	padding: 8px;
	background: #F5F5F5;
	border: solid #ddd;
	border-width: 0 1px 1px
}

#settleup-2013 .smb b {
	margin: 0 5px;
	color: #E4393C
}

#settleup-2013 .smb strong {
	font-size: 18px;
	color: #E4393C
}

#settleup-2013 .smb a {
	display: inline-block;
	width: 120px;
	height: 30px;
	margin-top: 6px;
	background: #E4393C;
	color: #fff;
	text-align: center;
	font-weight: 700;
	line-height: 30px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px
}

#settleup-2013 li .gift {
	height: 17px;
	width: 310px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

#settleup-2013 li .gift a, #settleup-2013 li .gift-jq {
	color: #999
}

#settleup-2013 .gift-jq {
	clear: both
}

* html #settleup-2013 .smc {
	height: 344px
}

* html #settleup-2013 li {
	font-family: "\5b8b\4f53"
}

* html #settleup-2013 dd {
	right: -1px
}

#settleup-2013 .dt {
	padding: 2px 10px
}

#settleup-2013 .dt-mz {
	color: #999;
	width: 310px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

#settleup-2013 .dt-mz a {
	color: #999
}

#settleup-2013 .dt-mz:hover {
	background: #fff
}

#mcart-suit .dt, #mcart-suit .dt:hover {
	background: #d3ebff
}

#mcart-mj .dt, #mcart-mz .dt, #mcart-mj .dt:hover, #mcart-mz .dt:hover {
	background: #bffab1
}

#settleup-content .fr .hl-green, #settleup-content .fr .hl-orange {
	margin-right: 0
}

#settleup-content .hl-green, #settleup-content .hl-orange {
	margin-right: 5px;
	color: #fff;
	display: inline-block;
	*zoom: 1;
	padding: 0 2px;
	font: 12px/16px simsun
}

#settleup-content .hl-green {
	background: #3b0
}

#settleup-content .hl-orange {
	background: #f60
}

#nav-2013 {
	position: relative;
	z-index: 6;
	height: 40px;
	padding-left: 210px;
	margin-bottom: 10px;
	background: #E4393C
}

#navitems-2013 {
	background: -moz-linear-gradient(top, #E64346, #E13335);
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#E64346),
		to(#E13335));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#E64346",
		endColorstr="#E13335");
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr="
		#E64346 ", endColorstr=" #E13335 ")"
}

#navitems-2013, #navitems-2013 li, #navitems-2013 li a {
	height: 40px
}

#navitems-2013 li {
	float: left;
	position: relative;
	width: 83px
}

#navitems-2013 li a {
	position: absolute;
	top: 0;
	left: 0;
	width: 85px;
	text-align: center;
	color: #fff;
	font: 700 15px/40px "microsoft yahei";
	text-decoration: none
}

#navitems-2013 .curr, #navitems-2013 .hover {
	z-index: 1
}

#navitems-2013 .curr a, #navitems-2013 .hover a {
	background: #A40000
}

#treasure {
	position: absolute;
	right: 0;
	top: 0
}

#categorys-2013 .mt b, #categorys-2013 h3, #categorys-2013 s,
	#categorys-2013.hover .mt b {
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#categorys-2013 {
	position: absolute;
	top: 0;
	left: 0;
	width: 210px;
	height: 40px
}

#categorys-2013 .mt {
	background: #CD2A2C
}

#categorys-2013 .mt a {
	display: block;
	height: 40px;
	padding-left: 20px;
	line-height: 40px;
	color: #fff
}

#categorys-2013 .mt b {
	top: 10px;
	right: 10px;
	width: 20px;
	height: 20px;
	background-position: -65px 0
}

#categorys-2013 .mc {
	display: none;
	position: absolute;
	top: 40px;
	left: 0;
	width: 203px;
	height: 402px;
	padding: 3px 3px 3px 0;
	background: #FAFAFA;
	border: solid #E4393C;
	border-width: 0 2px 2px;
	overflow: visible
}

#categorys-2013 .item {
	width: 200px;
	height: 28px;
	border-top: 1px solid #FFF
}

#categorys-2013 .fore1 {
	border-top: 0
}

#categorys-2013 span {
	display: block;
	width: 203px;
	position: absolute;
	z-index: 1
}

#categorys-2013 h3 {
	width: 186px;
	height: 26px;
	line-height: 26px;
	padding-left: 13px;
	border-width: 1px 0;
	background-image: none;
	font-weight: 400
}

#categorys-2013 h3 a:link, #categorys-2013 h3 a:visited {
	color: #333
}

#categorys-2013 h3 a:hover, #categorys-2013 h3 a:active {
	color: #E4393C;
	font-weight: 700
}

#categorys-2013 s {
	display: block;
	position: absolute;
	top: 10px;
	left: 189px;
	width: 6px;
	height: 9px;
	background-position: -110px -45px
}

#categorys-2013 .item .i-mc {
	display: none;
	position: absolute;
	left: 198px;
	top: 3px;
	width: 705px;
	border: 1px solid #DDD;
	background: #fff;
	overflow: visible;
	-moz-box-shadow: 0 0 10px #DDD;
	-webkit-box-shadow: 0 0 10px #DDD;
	box-shadow: 0 0 10px #DDD
}

#categorys-2013 .item dt {
	padding: 3px 6px 0 0;
	font-weight: 700;
	color: #E4393C
}

#categorys-2013 .item dd {
	padding: 3px 0 0;
	overflow: hidden;
	zoom: 1
}

#categorys-2013 .subitem {
	float: left;
	width: 477px;
	min-height: 370px;
	padding: 0 4px 0 8px
}

#categorys-2013 .fore13 .subitem {
	min-height: 382px
}

#categorys-2013 .subitem dl {
	border-top: 1px solid #EEE;
	padding: 6px 0;
	overflow: hidden;
	zoom: 1
}

#categorys-2013 .subitem .fore1 {
	border-top: 0
}

#categorys-2013 .subitem dt {
	float: left;
	width: 54px;
	line-height: 22px;
	text-align: right
}

#categorys-2013 .subitem dd {
	overflow: hidden;
	*zoom: 1
}

#categorys-2013 .subitem em {
	float: left;
	height: 14px;
	margin: 4px 0;
	line-height: 14px;
	padding: 0 8px;
	border-left: 1px solid #ccc
}

#categorys-2013 .subitem dt a {
	color: #E4393C;
	text-decoration: underline
}

#categorys-2013 .subitem dd a {
	white-space: nowrap
}

#categorys-2013 .fr {
	width: 210px;
	padding-bottom: 2010px;
	margin-bottom: -2000px
}

#categorys-2013 .fr dl {
	width: 194px;
	padding: 6px 8px
}

#categorys-2013 .fr a {
	color: #666
}

#categorys-2013 .fr dd {
	padding-top: 6px;
	line-height: 20px;
	overflow: hidden
}

#categorys-2013 .fr img {
	margin-bottom: 4px
}

#categorys-2013 .categorys-brands li {
	float: left;
	width: 97px
}

#categorys-2013 .mc .extra {
	display: none
}

#categorys-2013 .close {
	position: absolute;
	top: -1px;
	left: 706px;
	z-index: 14;
	width: 26px;
	height: 26px;
	background: rgba(0, 0, 0, .6);
	text-align: center;
	line-height: 26px;
	color: #fff;
	cursor: pointer;
	font-size: 26px;
	background-color: transparent\9;
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=1,
		startColorstr='#60000000', endColorstr='#60000000')
}

#categorys-2013 .loading-style1 {
	margin-top: 10px
}

#categorys-2013 .fore1 .categorys-brands li, #categorys-2013 .fore13 .categorys-brands li
	{
	width: 194px
}

#categorys-2013 .fore13 .i-mc {
	top: 23px
}

#categorys-2013 .fore13 .categorys-brands li {
	width: 97px
}

#categorys-2013 .fore14 .categorys-brands li {
	width: 194px
}

#categorys-2013 .hover span {
	z-index: 13;
	width: 160px
}

#categorys-2013 .hover h3 {
	border: solid #DDD;
	border-width: 1px 0;
	background-color: #fff;
	overflow: hidden;
	-moz-box-shadow: 0 0 8px #DDD;
	-webkit-box-shadow: 0 0 8px #DDD;
	box-shadow: 0 0 8px #DDD
}

#categorys-2013 .hover s {
	left: 199px;
	top: -4px;
	width: 7px;
	height: 38px;
	background: #fff;
	overflow: hidden
}

#categorys-2013 .fore1.hover s {
	top: 1px
}

#categorys-2013 .hover .i-mc {
	display: block;
	z-index: 12
}

#categorys-2013.hover .mt b {
	background-position: -65px -23px
}

#categorys-2013.hover .mc {
	display: block
}

* html #categorys-2013 .item dd {
	padding-bottom: 6px
}

* html #categorys-2013 .subitem {
	height: 382px
}

* html #categorys-2013 .fore13 .subitem {
	height: 382px
}

#categorys-2013 .categorys-links {
	padding: 10px 8px
}

#categorys-2013 .categorys-links a {
	display: block;
	width: 194px;
	height: 30px;
	background-image: url(../images/28.png);
	background-repeat: no-repeat;
	line-height: 80px;
	overflow: hidden
}

#categorys-links-diy a {
	background-position: 0 0
}

#categorys-links-dpg a {
	background-position: 0 -30px
}

#categorys-links-cellphone a {
	background-position: 0 -60px
}

#categorys-links-jzc a {
	background-position: 0 -90px
}

#categorys-2013 .item-col2 .subitem {
	width: auto;
	padding: 0 8px
}

#categorys-2013 .sub-item-col {
	width: 334px
}

#categorys-2013 .sub-item-col .fore1 {
	padding-top: 0
}

#categorys-2013 .sub-item-col0 {
	border-right: 1px solid #eee;
	margin-right: 8px;
	margin-bottom: 8px;
	padding-right: 8px;
	min-height: 370px
}

#categorys-2013 .title-list {
	font-size: 14px;
	padding: 5px 10px;
	margin: 0 10px 10px;
	border-bottom: 1px solid #eee
}

#categorys-2013 .title-list li {
	padding-left: 30px;
	height: 28px;
	line-height: 28px;
	margin-right: 20px;
	background-image:
		url(../images/virtuals-cat-ico20140826.png);
	background-repeat: no-repeat
}

#categorys-2013 .title-list li.fore1 {
	background-position: 0 0
}

#categorys-2013 .title-list li.fore2 {
	background-position: 0 -48px
}

#categorys-2013 .title-list li.fore3 {
	background-position: 0 -99px
}

#categorys-2013 .title-list li.fore4 {
	background-position: 0 -144px
}

#categorys-2013 .title-list li.fore5 {
	background-position: 0 -191px
}

#categorys-2013 .title-list li.fore6 {
	background-position: 0 -241px
}

* html #categorys-2013 .sub-item-col0 {
	height: 370px
}

#service-2013 dl b {
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#service-2013 {
	padding: 10px 20px;
	margin-bottom: 20px;
	background: #FFF;
	border-top: 1px solid #DDD;
	border-bottom: 1px solid #F1F1F1
}

#service-2013 dl {
	float: left;
	width: 196px
}

#service-2013 dt {
	position: relative;
	padding: 6px 0 6px 44px;
	font: 14px "microsoft yahei";
	zoom: 1
}

#service-2013 dd {
	min-height: 120px;
	padding-left: 24px;
	margin-left: 20px;
	line-height: 20px
}

#service-2013 dt b {
	position: absolute;
	top: 5px;
	left: 0;
	width: 40px;
	height: 40px
}

#service-2013 dl.fore1 b {
	background-position: 0 -55px
}

#service-2013 dl.fore2 b {
	background-position: -50px -55px
}

#service-2013 dl.fore3 b {
	background-position: 0 -102px
}

#service-2013 dl.fore4 b {
	background-position: -50px -102px
}

#service-2013 dl.fore5 b {
	background-position: 0 -149px
}

#service-2013 dl.fore5 {
	width: 160px
}

#service-2013 .fr {
	display: none
}

* html #service-2013 dd {
	height: 120px
}

.root61 #service-2013 dl {
	width: 252px
}

.root61 #service-2013 dl.fore5 {
	width: 160px
}

#footer-2013 {
	padding-bottom: 30px;
	text-align: center
}

#footer-2013 .links a, #footer-2013 .links span {
	margin: 0 10px
}

#footer-2013 .links span a {
	margin: 0
}

#footer-2013 .copyright {
	margin: 10px 0
}

#footer-2013 .authentication a {
	margin: 0 5px
}

.footmark .m {
	padding: 0 9px;
	border: 1px solid #ddd;
	border-top: 2px solid #999
}

.footmark .mt {
	height: 30px;
	line-height: 30px
}

.footmark .title {
	width: 50%;
	float: left;
	font-weight: 400
}

.footmark .extra {
	width: 50%;
	float: right;
	text-align: right
}

.footmark .may-like .change {
	display: inline-block
}

.footmark .may-like .change .ico, .may-like .change .txt {
	display: inline-block;
	vertical-align: middle;
	*cursor: pointer
}

.footmark .may-like .change .ico {
	width: 16px;
	height: 16px;
	margin-right: 5px;
	background:
		url(../images/update.png)
		no-repeat
}

.footmark .may-like .mc {
	height: 246px;
	overflow: hidden
}

.footmark .may-like-list {
	padding-top: 15px;
	margin-right: -10px
}

.footmark .may-like-list li {
	width: 150px;
	height: 216px;
	float: left;
	margin: 0 8px 0 0;
	padding: 0 18px 15px;
	text-align: center
}

.footmark .may-like-list .p-img img {
	width: 130px;
	height: 130px
}

.footmark .may-like-list .p-name {
	height: 36px
}

.footmark .may-like-list .p-review {
	line-height: 20px
}

.footmark .may-like-list .p-review a {
	color: #005ea7
}

.footmark .may-like-list .p-price {
	line-height: 20px;
	color: #e3393c
}

.footmark .recent-view .mc {
	height: 126px;
	overflow: hidden
}

.footmark .recent-view-list {
	margin-right: -36px;
	padding-top: 14px
}

.footmark .recent-view-list li {
	width: 86px;
	float: left;
	margin: 0 2px 0 0;
	padding-bottom: 14px;
	text-align: center
}

.footmark .recent-view-list .p-img img {
	width: 70px;
	height: 70px
}

.footmark .recent-view-list .p-price {
	color: #e3393c
}

.root61 .footmark .may-like-list li {
	padding-left: 20px
}

.root61 .footmark .recent-view-list li {
	margin: 0 2px 0 3px;
	*display: inline
}

#shortcut-2013 #app-jd {
	padding-left: 37px
}

#app-jd i {
	position: absolute;
	z-index: 2;
	left: 14px;
	top: 5px;
	width: 13px;
	height: 22px;
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat;
	background-position: -128px -360px;
	-webkit-transition: all .2s ease;
	transition: all .2s ease
}

#app-jd.hover i {
	background-position: -128px -399px
}

#app-jd .dd {
	left: 5px;
	width: 210px;
	padding: 20px 0 20px 20px
}

#app-jd .dd .qr-code {
	position: relative;
	margin-bottom: 8px
}

#app-jd .dd .qr-code i {
	position: absolute;
	display: block;
	width: 49px;
	height: 23px;
	background:
		url(../images/20130330A_2.png)
		no-repeat 0 -438px;
	left: 88px;
	top: 5px
}

#app-jd .dd .qr-code .details {
	position: absolute;
	left: 103px;
	top: 28px
}

#app-jd .dd .qr-code .details em, #app-jd .dd .qr-code .details strong {
	display: block;
	line-height: 20px
}

#app-jd .dd .qr-code .details em {
	color: #999
}

#app-jd .dd .qr-code .details strong {
	color: #E4393C;
	font-size: 14px
}

#app-jd .app-btn {
	height: 29px;
	font-size: 0
}

#app-jd .btn-app-apple, #app-jd .btn-app-android {
	width: 97px;
	height: 29px;
	display: inline-block;
	line-height: 29px;
	background-image:
		url(../images/20130330A_2.png);
	background-repeat: no-repeat
}

#app-jd .btn-app-apple {
	background-position: 0 -360px;
	margin-right: 5px
}

#app-jd .btn-app-android {
	background-position: 0 -399px
}

#app-jd .qr-item {
	position: relative
}

#app-jd .qr-item.qr-jd-app {
	margin-bottom: 30px
}

#app-jd .qr-item .qr-img {
	position: absolute;
	left: 0;
	top: 10px
}

#app-jd .qr-item .qr-ext {
	padding-left: 92px
}

#app-jd .qr-item .qr-ext strong, #app-jd .qr-item .qr-ext a {
	display: block;
	margin: 0
}

#app-jd .qr-item .qr-ext strong {
	line-height: 20px;
	margin-bottom: 7px;
	color: #E4393C
}

#app-jd .qr-item .qr-ext .btn-app-apple {
	margin-bottom: 7px
}

#shortcut-2013 #app-jd.hover .outline, #shortcut-2013 #app-jd.hover .blank
	{
	width: 98px
}

#app-jd .qr-info {
	display: none
}

#app-jd .dd {
	padding-top: 60px;
	padding-left: 30px;
	padding-right: 10px
}

#app-jd .qr-info {
	display: block;
	position: absolute;
	top: 24px;
	left: 8px;
	width: 220px;
	height: 65px;
	background:
		url(../images/537b084eN94336622.png)
}

#shortcut-2013 #jd-vip {
	padding-left: 38px
}

#jd-vip:hover i {
	background-position: 0 -15px
}

#jd-vip i {
	position: absolute;
	left: 10px;
	top: 9px;
	display: block;
	width: 24px;
	height: 11px;
	overflow: hidden;
	background: url(../images/vip.png)
}

initcart20150123.css

/taotao-portal/src/main/webapp/css/initcart20150123.css

/*publish time:2013-04-25 19:36*/
.left{float:left;width:770px;  }
.right-extra{float:right;width:210px;}
.p-name a:link,.p-name a:visited{color:#666;}
.p-name a:hover{color:#E4393C;}
/*succeed*/
#succeed{position:relative;overflow:visible;}
#succeed .corner{display:none;position:absolute;width:4px;height:4px;font-size:0;line-height:0;overflow:hidden;}
#succeed .tl{top:-1px;left:-1px;background-position:-17px 0;}
#succeed .tr{top:-1px;right:-1px;background-position:-21px 0;}
#succeed .bl{bottom:-1px;left:-1px;background-position:-17px -4px;}
#succeed .br{bottom:-1px;right:-1px;background-position:-21px -4px;}
#succeed .btn-pay,#succeed .btn-continue,#succeed .btn-append{background:#ccc url(i/20130425D.png) no-repeat;line-height:100px;overflow:hidden;display:block;}
#succeed .btn-pay{float:right;width:189px;height:36px;margin:0 25px 0 10px;_margin-right:12px;background-position:0 0;}
#succeed .btn-continue{float:right;background-position:-90px -37px;width:94px;height:36px;}
#succeed .btn-append{background-position:-41px 0;width:93px;height:23px;}
#succeed .success{overflow:hidden;height:65px;padding:31px 10px 16px 80px;zoom:1;}
#succeed .success b,#succeed .success-b{float:left;overflow:hidden;width:304px;height:40px;padding-left:56px;background:url(i/20130425D.png) no-repeat 0 -100px;font:normal 24px/40px \5fae\8f6f\96c5\9ed1;color:#7ABD54;}
#succeed .success-b{color:#999;font:12px/150% Arial,Verdana,"\5b8b\4f53";height:auto}
#succeed .success-b h3{font:normal 24px/40px \5fae\8f6f\96c5\9ed1;color:#7ABD54;}

.extend{overflow:hidden;margin-top:10px;width:565px;padding-left:35px;}
.extend li{zoom:1;overflow:hidden;line-height:23px;font-size:12px;margin-bottom:5px;}
.extend p{float:left;width:470px;overflow:hidden;}
.extend .font1{color:#f60204;}
/*m1*/
.m1{border:1px solid #ddd;}
.m1 .mt{height:30px;background:#f7f7f7;}
.m1 .mt h2{height:30px;padding-left:10px;font:normal 14px/31px \5fae\8f6f\96c5\9ed1;color:#333}
.m1 .mt .tl{display:none;}
.m1 .mc{overflow:hidden;width:758px;padding:2px 5px;}
.m1 .mc dl{float:left;width:33.3%;padding:10px 0;}
.m1 .mc dt{float:left;padding-left:5px;}
.m1 .mc dd{float:left;width:130px;padding:5px;}
.m1 .mc dd div{margin-bottom:5px;}
.m1 .p-name{height:1.5em;}
.m1 .mc dd .p-price{margin-bottom:5px;}
.m1 .p-price {height:18px; overflow:hidden; zoom:1;}
.m1 .p-price img {margin-top:1px; float:left;}
.m1 .p-price span {padding-left:4px; _padding-left:8px; float:left;}
.m1 .p-review a:link,.m1 .p-review a:visited{color:#005aa0;}
.m1 .btn-append{display:block;overflow:hidden;width:89px;height:21px;background:url(i/20130425D.png) #F6F6F6 no-repeat 0 -63px;text-align:center;text-decoration:none;line-height:21px;color:#333;}
.m1 .mb{display:none;}
/*promotion*/
#promotion .p-price span{color:red;font-weight:bold;}
/*mycart-detail*/
#mycart-detail{position:relative;overflow:visible;border-width:2px 1px 1px;border-style:solid;border-color:#999 #ddd #ddd;zoom:1;}
#mycart-detail .corner{display:none;}
#mycart-detail .mt{height:30px;background:#f7f7f7;}
#mycart-detail .mt h2{padding-left:9px;font:normal 14px/30px \5fae\8f6f\96c5\9ed1;color:#333;}
#mycart-detail .mt h2 s{float:left;width:20px;height:16px;margin:8px 8px 0 0;background:url(i/20130425D.png) no-repeat -90px -74px;}
#mycart-detail .mc{padding-top:6px;}
#mycart-detail h3{padding:0 10px;font-size:12px;font-weight:normal;color:#333;}
#mycart-detail dl{overflow:hidden;zoom:1;}
#mycart-detail dt{float:left;margin:0;}
#mycart-detail dd{float:right;width:110px;}
#mycart-detail .new{padding-bottom:8px;border-bottom:1px dotted #ddd;margin:10px 10px 8px;}
#mycart-detail .new .p-price span{font-family:verdana;font-size:12px;color:#E4393C;}
#mycart-detail .old{padding:10px;}
#mycart-detail .total{margin-top:10px;padding:10px;background:#F7F7F7;}
#mycart-detail .total strong{padding:0 3px;font-family:verdana;font-size:15px;color:#E4393C;}
#mycart-detail #skuCount{font-size:12px;}
#mycart-detail .btns{padding:0 10px 10px;background:#F7F7F7;}
#mycart-detail .btn-pay{display:block;overflow:hidden;width:189px;height:36px;background:url(i/20130425D.png) red no-repeat;line-height:100px;}
/*promotion*/
/*pt*/
.m1 .p-price .p-tag {
    float:none;
}
.m1 .p-price .p-tag a:hover {
    color:#fff;
    text-decoration:none;
}
.pt1,.pt2,.pt3,.pt4,.pt5{padding:1px 2px;margin:0 1px;margin-bottom:-3px;background:#E4393C;line-height:14px;text-align:center;font-size:12px;color:#fff;*zoom:1;}
/*
.pt1,.pt2,.pt3,.pt4{display:inline-block;width:28px;height:16px;margin:0 2px;overflow:hidden;background-image:url(http://misc.360buyimg.com/201007/skin/df/i/icon_promotion20110727.png);background-repeat:no-repeat;line-height:100px;font-size:0;margin-bottom:-3px;*margin-bottom:12px;}
.pt1{background-position:-71px -180px;}
.pt2{background-position:-100px -180px;}
.pt3{background-position:-42px -180px;}
.pt4{background-position:0 -180px;width:41px;}
*html .pi1,*html .pi2,*html .pi3,*html .pi4,*html .pi5,*html .pi6,*html .pi7,*html .pi8,*html .pi9,*html .pi10,*html .pi11,*html .pi12{background-image:url(http://misc.360buyimg.com/201007/skin/df/i/icon_promotion20110727.gif);}
*/
#cart_yb .extend {margin-bottom:5px;}
#cart_yb .extend-minimize {height:84px;}
#cart_yb .extend .item {overflow:hidden; line-height:23px;font-size:12px;margin-bottom:5px; zoom:1;}
#cart_yb .btn-append {float:left;}
#cart_yb .extend-more .inner {width:776px;}
.root61 #cart_yb .extend-more .inner {width:996px;}
#cart_yb .extend-more {height:18px; margin-bottom:5px; overflow:hidden;}
#cart_yb .extend-more .inner {width:900px; height:17px; border-top:1px solid #ccc; text-align:center;}
#extend-more-btn {width:60px; height:16px; margin:-1px auto 0; border:1px solid #ccc; border-top-color:#fff; position:relative; text-align:left; cursor:pointer; background:url(i/more-bg-1.gif) repeat-x;}
#extend-more-btn span, #extend-more-btn s {float:left; cursor:pointer;}
#extend-more-btn span {margin-right:5px; color:#666; line-height:16px;}
#extend-more-btn s {width:5px; height:7px; margin-top:4px; overflow:hidden; line-height:0; font-size:0; background:url(i/more-arrow-1.gif) no-repeat;}
#cart_yb .extend-more span {padding-left:15px;}
#cart_yb .extend-more .extend-collapse s {background-position:0 -6px;}
#mycart-detail .p-extend-service {color:#999;}
/*lq 20130411*/
#cart_yb2 .extend {margin-bottom:5px;}
#cart_yb2 .extend-minimize {height:84px;}
#cart_yb2 .extend .item {overflow:hidden; line-height:23px;font-size:12px;margin-bottom:5px; zoom:1;}
#cart_yb2 .btn-append {float:left;}
#cart_yb2 .extend-more .inner {width:776px;}
.root61 #cart_yb2 .extend-more .inner {width:996px;}
#cart_yb2 .extend-more {height:18px; margin-bottom:5px; overflow:hidden;}
#cart_yb2 .extend-more .inner {width:900px; height:17px; border-top:1px solid #ccc; text-align:center;}
#extend-more-btn {width:60px; height:16px; margin:-1px auto 0; border:1px solid #ccc; border-top-color:#fff; position:relative; text-align:left; cursor:pointer; background:url(i/more-bg-1.gif) repeat-x;}
#extend-more-btn span, #extend-more-btn s {float:left; cursor:pointer;}
#extend-more-btn span {margin-right:5px; color:#666; line-height:16px;}
#extend-more-btn s {width:5px; height:7px; margin-top:4px; overflow:hidden; line-height:0; font-size:0; background:url(i/more-arrow-1.gif) no-repeat;}
#cart_yb2 .extend-more span {padding-left:15px;}
#cart_yb2 .extend-more .extend-collapse s {background-position:0 -6px;}
#mycart-detail .p-extend-service {color:#999;}
#cart_yb2{position:relative;padding:10px 0 0 150px;/*border:1px solid #D0E4C2;background:#FCFFFA;*/}
#cart_yb2 .service-yb-tit{position:absolute;top:15px;left:84px;}
#cart_yb2 .service-type { padding-bottom:5px; overflow:hidden; *zoom:1; clear:both; }
#cart_yb2 .item { position:relative; float: left;margin: 2px 8px 2px 0}
#cart_yb2 .item a { padding:2px 5px 2px 22px;  border: 1px solid #ccc;display:block;white-space: nowrap;text-decoration: none;}
#cart_yb2 .selected b{position:absolute;bottom:0;right:0;overflow:hidden;width:12px;height:12px;background:url(i/20130425D.png) no-repeat -116px -75px;}
#cart_yb2 .item a:hover,
#cart_yb2 .selected a{padding:1px 4px 1px 21px;border:2px solid #E4393C;}
#cart_yb2 .item i { display:block; position:absolute; left:4px; top:4px; width:16px; height:16px;}
#cart_yb2 .service-yb-buy{display:block;overflow:hidden;width:89px;height:25px;margin-bottom:10px;background:url(i/20130425D.png) no-repeat 0 -37px;line-height:24px;text-align:center;text-decoration:none;color:#333;}
#cart_yb2  .item i{background-image:url(http://misc.360buyimg.com/purchase/skin/i/yb-icons.jpg);background-repeat:no-repeat;}
.yb-ico-t2,
.yb-ico-t3,
.yb-ico-t4 { background-position:0 0;}
.yb-ico-t6,
.yb-ico-t7 { background-position:-54px 0; }
.yb-ico-t9 { background-position:-18px 0;}
/*root61*/
.root61 .left{width:990px;}
.root61 .m1 .mc{width:978px;}
.root61 .m1 .mc dd{width:200px;}
.root61 #succeed .btn-pay{margin:0 150px 0 10px;_margin-right:75px;}
.root61 #succeed .success{padding:31px 10px 16px 140px;}

/* cellphone-reco */
#cellphone .tab-hd { padding:10px; margin:0 20px; border-bottom:1px solid #eee; overflow:hidden; *zoom:1;}
#cellphone .tab-hd a,
#cellphone .tab-hd li { color:#005ea7;}
#cellphone .tab-hd li.curr { color:#e4393c; cursor:default; font-weight:bold; }
#cellphone .tab-hd li.last { border:none; }

#cellphone .tab-hd ul { float:left; }
#cellphone .tab-hd .extra { float:right; }
#cellphone .tab-hd li { float:left; border-right:1px solid #ccc; cursor:pointer; margin-right:10px; padding-right:10px;}

/* similar-reco */
#similar .tab-hd { padding:10px; margin:0 20px; border-bottom:1px solid #eee; overflow:hidden; *zoom:1;}
#similar .tab-hd a,
#similar .tab-hd li { color:#005ea7;}
#similar .tab-hd li.curr { color:#e4393c; cursor:default; font-weight:bold; }
#similar .tab-hd li.last { border:none; }

#similar .tab-hd ul { float:left; }
#similar .tab-hd .extra { float:right; }
#similar .tab-hd li { float:left; border-right:1px solid #ccc; cursor:pointer; margin-right:10px; padding-right:10px;}
.ftx-05{color:#005ea7;}
.ml10{margin-left:10px;}
.btn-1{
	background-color: #e74649;
    background-image: -moz-linear-gradient(top,#e74649,#df3134);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#e74649),color-stop(1,#df3134));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e74649', endColorstr='#df3134', GradientType='0');
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e74649', endColorstr='#df3134');
    background-image: linear-gradient(to top,#e74649 0,#df3134 100%);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    height: 18px;
    line-height: 18px;
    padding: 9px 30px;
    color: #fff;
    font-size:15px;
    font-weight:bold;
    font-family:'\5fae\8f6f\96c5\9ed1';
}
.btn-1:hover {
    background-color: #f05356;
    background-image: -moz-linear-gradient(top,#f05356,#eb3c3f);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#f05356),color-stop(1,#eb3c3f));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f05356', endColorstr='#eb3c3f', GradientType='0');
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f05356', endColorstr='#eb3c3f');
    background-image: linear-gradient(to top,#f05356 0,#eb3c3f 100%)
}

.btn-1:link,.btn-1:visited{
    color: #fff;
    text-decoration: none
}
.btn-9{
	background-color: #f7f7f7;
    background-image: -moz-linear-gradient(top,#f7f7f7,#f3f2f2);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#f7f7f7),color-stop(1,#f3f2f2));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#f3f2f2', GradientType='0');
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#f3f2f2');
    background-image: linear-gradient(to top,#f7f7f7 0,#f3f2f2 100%);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    height: 18px;
    line-height: 18px;
    border: 1px solid #ddd;
    padding: 8px 29px;
    color: #444;
    font-size:15px;
    font-weight:bold;
    font-family:'\5fae\8f6f\96c5\9ed1';
}
.btn-9:hover {
    background-color: #f8f8f8;
    background-image: -moz-linear-gradient(top,#f8f8f8,#f5f5f5);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#f8f8f8),color-stop(1,#f5f5f5));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='whitesmoke', GradientType='0');
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='whitesmoke');
    background-image: linear-gradient(to top,#f8f8f8 0,#f5f5f5 100%)
}

.btn-9:link,.btn-9:visited{
    color: #444;
    text-decoration: none
}
#succeed .success{padding-left:0;}
.root61 #succeed .success{padding-left:80px;}

测试

1.4 展示购物车商品

用户点击“我的购物车”展示购物车信息

需要展示购物车页面，没有参数

只需要把cookie中把商品列表取出来，展示到页面调用

1.4.1 server

从cookie中把购物车列表取出来，没有参数，返回购物车中的商品列表

CartService.java

/taotao-portal/src/main/java/com/taotao/portal/service/CartService.java

package com.taotao.portal.service;

import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.pojo.CartItem;
/**
 * 购物车
 * @author Lenovo
 *
 */
public interface CartService {
	/**
	 * 添加购物车商品
	 */
	TaotaoResult addCartItem(long itemId,int num,HttpServletRequest request, HttpServletResponse response);
	/**
	 * 展示购物车商品
	 */
	List getCartItemList(HttpServletRequest request, HttpServletResponse response);
	
}

CartServiceImpl.java

/taotao-portal/src/main/java/com/taotao/portal/service/impl/CartServiceImpl.java

package com.taotao.portal.service.impl;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;

import com.taotao.common.utill.CookieUtils;
import com.taotao.common.utill.HttpClientUtil;
import com.taotao.common.utill.JsonUtils;
import com.taotao.common.utill.TaotaoResult;
import com.taotao.pojo.TbItem;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 * 购物车
 * 
 * @author Lenovo
 *
 */
@Service
public class CartServiceImpl implements CartService {

	@Value("${REST_BASE_URL}")
	private String REST_BASE_URL;
	@Value("${ITME_INFO_URL}")
	private String ITME_INFO_URL;

	/**
	 * 添加购物车商品
	 * 
	 * @param itemId
	 * @param num
	 * @return
	 */
	@Override
	public TaotaoResult addCartItem(long itemId, int num, HttpServletRequest request, HttpServletResponse response) {

		// 取商品信息
		CartItem cartItem = null;

		// 取购物车商品列表
		List itemList = getCartItemList(request);
		// 判断购物车商品列表中是否存在此商品
		for (CartItem cItem : itemList) {
			// 如果存在此商品
			if (cItem.getId() == itemId) {
				// 增加商品数量
				cItem.setNum(cItem.getNum() + num);
				cartItem = cItem;
				break;
			}
		}
		if (cartItem == null) {
			cartItem = new CartItem();
			// 根据商品id查询商品基本信息。
			String json = HttpClientUtil.doGet(REST_BASE_URL + ITME_INFO_URL + itemId);
			// 把json转换成java对象
			TaotaoResult taotaoResult = TaotaoResult.formatToPojo(json, TbItem.class);
			if (taotaoResult.getStatus() == 200) {
				TbItem item = (TbItem) taotaoResult.getData();
				cartItem.setId(item.getId());
				cartItem.setTitle(item.getTitle());
				cartItem.setImage(item.getImage() == null ? "" : item.getImage().split(",")[0]);
				cartItem.setNum(num);
				cartItem.setPrice(item.getPrice());
			}
			// 添加到购物车列表
			itemList.add(cartItem);
		}
		// 把购物车列表写入cookie
		CookieUtils.setCookie(request, response, "TT_CART", JsonUtils.objectToJson(itemList), true);

		return TaotaoResult.ok();
	}

	/**
	 * 从cookie中取商品列表
	 */
	private List getCartItemList(HttpServletRequest request) {
		// 从cookie中取商品列表
		String cartJson = CookieUtils.getCookieValue(request, "TT_CART", true);
		if (cartJson == null) {
			return new ArrayList<>();
		}
		// 把json转换成商品列表
		try {
			List list = JsonUtils.jsonToList(cartJson, CartItem.class);
			return list;
		} catch (Exception e) {
			e.printStackTrace();
		}
		return new ArrayList<>();
	}

	/**
	 * 展示购物车商品
	 */
	@Override
	public List getCartItemList(HttpServletRequest request, HttpServletResponse response) {
		// TODO Auto-generated method stub
		List itemList = getCartItemList(request);
		return itemList;
	}

}

1.4.2 controller

调用service取购物车商品列表，把购物车商品传递给jsp，在购物车列表中展示商品。

请求的url:http://localhost:8082/cart/cart.html

返回的界面：cart.jsp

CartController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/CartController.java

package com.taotao.portal.controller;


import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 * 购物车Controller
 * 
 */
@Controller
@RequestMapping("/cart")
public class CartController {

	@Autowired
	private CartService cartService;
	
	@RequestMapping("/add/{itemId}")
	public String addCartItem(@PathVariable Long itemId, 
			@RequestParam(defaultValue="1")Integer num, 
			HttpServletRequest request, HttpServletResponse response) {
		TaotaoResult result = cartService.addCartItem(itemId, num, request, response);
		return "cartSuccess";
	}
	
	/**
	 * 展示购物车商品
	 */
	@RequestMapping("/cart")
	public String showCart(HttpServletRequest request, HttpServletResponse response, Model model) {
		List list = cartService.getCartItemList(request, response);
		model.addAttribute("cartList", list);
		return "cart";
	}
	
}

测试

http://localhost:8082/

报错：

cart.jsp

/taotao-portal/src/main/webapp/WEB-INF/jsp/cart.jsp

CartController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/CartController.java

package com.taotao.portal.controller;


import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 * 购物车Controller
 * 
 */
@Controller
@RequestMapping("/cart")
public class CartController {

	@Autowired
	private CartService cartService;
	
	@RequestMapping("/add/{itemId}")
	public String addCartItem(@PathVariable Long itemId, 
			@RequestParam(defaultValue="1")Integer num, 
			HttpServletRequest request, HttpServletResponse response) {
		TaotaoResult result = cartService.addCartItem(itemId, num, request, response);
		return "redirect:/cart/success.html";
	}
	
	@RequestMapping("/success")
	public String showSuccess() {
		return "cartSuccess";
	}
	
	/**
	 * 展示购物车商品
	 */
	@RequestMapping("/cart")
	public String showCart(HttpServletRequest request, HttpServletResponse response, Model model) {
		List list = cartService.getCartItemList(request, response);
		model.addAttribute("cartList", list);
		return "cart";
	}
	
}

1.5 修改商品数量

当点击购物车商品的“+”、“-”号时增加或减少商品数量。减少商品数量时，如果数量为“1”则不继续减少。

cart.jsp

/taotao-portal/src/main/webapp/WEB-INF/jsp/cart.jsp

cart.js

/taotao-portal/src/main/webapp/js/cart.js

购物车商品数量的修改

1.6 删除购物车商品

在购物车页面中，点击删除链接，接受要删除的商品id，从cookie中找到商品删除，重新写入cookie，重新展示购物车页面

1.6.1 server

CartService.java

/taotao-portal/src/main/java/com/taotao/portal/service/CartService.java

package com.taotao.portal.service;

import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.pojo.CartItem;
/**
 * 购物车
 * @author Lenovo
 *
 */
public interface CartService {
	/**
	 * 添加购物车商品
	 */
	TaotaoResult addCartItem(long itemId,int num,HttpServletRequest request, HttpServletResponse response);
	/**
	 * 展示购物车商品
	 */
	List getCartItemList(HttpServletRequest request, HttpServletResponse response);
	
	/**
	 * 删除购物车商品
	 */
	TaotaoResult deleteCartItem(long itemId, HttpServletRequest request, HttpServletResponse response);
}

CartServiceImpl.java

/taotao-portal/src/main/java/com/taotao/portal/service/impl/CartServiceImpl.java

package com.taotao.portal.service.impl;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;

import com.taotao.common.utill.CookieUtils;
import com.taotao.common.utill.HttpClientUtil;
import com.taotao.common.utill.JsonUtils;
import com.taotao.common.utill.TaotaoResult;
import com.taotao.pojo.TbItem;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 * 购物车
 * 
 * @author Lenovo
 *
 */
@Service
public class CartServiceImpl implements CartService {

	@Value("${REST_BASE_URL}")
	private String REST_BASE_URL;
	@Value("${ITME_INFO_URL}")
	private String ITME_INFO_URL;

	/**
	 * 添加购物车商品
	 * 
	 * @param itemId
	 * @param num
	 * @return
	 */
	@Override
	public TaotaoResult addCartItem(long itemId, int num, HttpServletRequest request, HttpServletResponse response) {

		// 取商品信息
		CartItem cartItem = null;

		// 取购物车商品列表
		List itemList = getCartItemList(request);
		// 判断购物车商品列表中是否存在此商品
		for (CartItem cItem : itemList) {
			// 如果存在此商品
			if (cItem.getId() == itemId) {
				// 增加商品数量
				cItem.setNum(cItem.getNum() + num);
				cartItem = cItem;
				break;
			}
		}
		if (cartItem == null) {
			cartItem = new CartItem();
			// 根据商品id查询商品基本信息。
			String json = HttpClientUtil.doGet(REST_BASE_URL + ITME_INFO_URL + itemId);
			// 把json转换成java对象
			TaotaoResult taotaoResult = TaotaoResult.formatToPojo(json, TbItem.class);
			if (taotaoResult.getStatus() == 200) {
				TbItem item = (TbItem) taotaoResult.getData();
				cartItem.setId(item.getId());
				cartItem.setTitle(item.getTitle());
				cartItem.setImage(item.getImage() == null ? "" : item.getImage().split(",")[0]);
				cartItem.setNum(num);
				cartItem.setPrice(item.getPrice());
			}
			// 添加到购物车列表
			itemList.add(cartItem);
		}
		// 把购物车列表写入cookie
		CookieUtils.setCookie(request, response, "TT_CART", JsonUtils.objectToJson(itemList), true);

		return TaotaoResult.ok();
	}

	/**
	 * 从cookie中取商品列表
	 */
	private List getCartItemList(HttpServletRequest request) {
		// 从cookie中取商品列表
		String cartJson = CookieUtils.getCookieValue(request, "TT_CART", true);
		if (cartJson == null) {
			return new ArrayList<>();
		}
		// 把json转换成商品列表
		try {
			List list = JsonUtils.jsonToList(cartJson, CartItem.class);
			return list;
		} catch (Exception e) {
			e.printStackTrace();
		}
		return new ArrayList<>();
	}

	/**
	 * 展示购物车商品
	 */
	@Override
	public List getCartItemList(HttpServletRequest request, HttpServletResponse response) {
		// TODO Auto-generated method stub
		List itemList = getCartItemList(request);
		return itemList;
	}

	/**
	 * 删除购物车商品
	 */
	@Override
	public TaotaoResult deleteCartItem(long itemId, HttpServletRequest request, HttpServletResponse response) {
		// 从cookie中取购物车商品列表
		List itemList = getCartItemList(request);
		// 从列表中找到此商品
		for (CartItem cartItem : itemList) {
			if (cartItem.getId() == itemId) {
				itemList.remove(cartItem);
				break;
			}

		}
		// 把购物车列表重新写入cookie
		CookieUtils.setCookie(request, response, "TT_CART", JsonUtils.objectToJson(itemList), true);

		return TaotaoResult.ok();
	}

}

1.6.2 controller

接受商品id，调用server删除购物车商品，返回购物车页面

请求的url:/cart/delete/${cart.id}.html

CartController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/CartController.java

package com.taotao.portal.controller;


import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 * 购物车Controller
 * 
 */
@Controller
@RequestMapping("/cart")
public class CartController {

	@Autowired
	private CartService cartService;
	
	/**
	 * 添加购物车商品
	 */
	@RequestMapping("/add/{itemId}")
	public String addCartItem(@PathVariable Long itemId, 
			@RequestParam(defaultValue="1")Integer num, 
			HttpServletRequest request, HttpServletResponse response) {
		TaotaoResult result = cartService.addCartItem(itemId, num, request, response);
		return "redirect:/cart/success.html";
	}
	
	@RequestMapping("/success")
	public String showSuccess() {
		return "cartSuccess";
	}
	
	/**
	 * 展示购物车商品
	 */
	@RequestMapping("/cart")
	public String showCart(HttpServletRequest request, HttpServletResponse response, Model model) {
		List list = cartService.getCartItemList(request, response);
		model.addAttribute("cartList", list);
		return "cart";
	}
	
	/**
	 * 删除购物车商品
	 */
	@RequestMapping("/delete/{itemId}")
	public String deleteCartItem(@PathVariable Long itemId, HttpServletRequest request, HttpServletResponse response) {
		cartService.deleteCartItem(itemId, request, response);
		return "redirect:/cart/cart.html";
	}
	
}

测试

1.7 购物车存在的问题

更换设备购物车不能同步
- 不能将购物车保存到数据库
- 要求用户登录才能同步信息
- 可以把购物车信息保存到redis中，key是用户，value是购物车列表
- 购物车商品合并问题
提交订单后的购物车商品需要清空

2 订单系统实现

2.1 订单表结构

订单表tb_order

订单商品表：tb_order_item

物流表：tb_order_shipping

2.2订单系统功能

下单功能
- 下单功能一定要使用关系型数据库，保证数据的一致性
查看订单列表
根据订单号查看订单详情

2.3 taotao-order

2.3.1 框架整合

mybatis

spring

springmvc

jedis

SqlMapConfig.xml

保留

db.properties

保留

resource.properties

清空内容

applicationContext-dao.xml

保留

applicationContext-jedis.xml

applicationContext-service.xml

applicationContext-trans.xml

springmvc.xml

pom.xml


	4.0.0
	
		com.taotao
		taotao-parent
		0.0.1-SNAPSHOT
	
	com.taotao
	taotao-order
	0.0.1-SNAPSHOT
	war

	
		
		
			com.taotao
			taotao-manager-mapper
			0.0.1-SNAPSHOT
		
		
		
			mysql
			mysql-connector-java
		
		
		
			com.alibaba
			druid
		
		
		
			org.springframework
			spring-context
		
		
			org.springframework
			spring-beans
		
		
			org.springframework
			spring-webmvc
		
		
			org.springframework
			spring-jdbc
		
		
			org.springframework
			spring-aspects
		
		
			javax.servlet
			servlet-api
			provided
		
		
		
			redis.clients
			jedis
		

	


	
		
			
			
				org.apache.tomcat.maven
				tomcat7-maven-plugin
				
					8085
					/

web.xml



	taotao-order
	
		index.html
		index.htm
		index.jsp
		default.html
		default.htm
		default.jsp
	

	
	
		contextConfigLocation
		classpath:spring/applicationContext-*.xml
	
	
		org.springframework.web.context.ContextLoaderListener
	
	
	
		CharacterEncodingFilter
		org.springframework.web.filter.CharacterEncodingFilter
		
			encoding
			utf-8
		
	
	
		CharacterEncodingFilter
		/*
	
	
	
		taotao-order
		org.springframework.web.servlet.DispatcherServlet
		
		
			contextConfigLocation
			classpath:spring/springmvc.xml
		
		1
	
	
		taotao-order
		/order/*

2.4 创建订单接口

2.4.1 接口说明

用户使用portal创建订单、android、ios、微信商城提交订单时使用

请求方法	POST
URL	http://order.taotao.com/order/create
参数说明	提交的数据格式： { “payment”: 5288, “postFee”: 0, “userId”: “3”, “buyerMessage”: null, “buyerNick”: “zhang123”, “orderItems”: [ { “itemId”: “9”, “num”: 1, “title”: “苹果（Apple）iPhone 6 (A1586) 16GB 金色移动联通电信4G手机3”, “price”: 5288, “totalFee”: 5288, “picPath”: “http://image.taotao.com/images/2015/03/06/2015030610045320609720.jpg” } ], “orderShipping”: { “receiverName”: “张三”, “receiverPhone”: “”, “receiverMobile”: “15800000000”, “receiverState”: “上海”, “receiverCity”: “上海”, “receiverDistrict”: “闵行区”, “receiverAddress”: “三鲁公路3279号明浦广场 3号楼 205室”, “receiverZip”: “200000” } }
示例
返回值	{ status: 200 //200 成功 msg: “OK” // 返回信息消息 data: 100544// 返回订单号 }

2.4.2 dao

要对三个表进行操作，都是插入操作。可以使用逆向工程生成的代码

2.4.3 server

功能：接受三个参数，对应订单表的pojo。订单明细表对应的商品列表，每个元素是提交订单明细表的pojo。物流表对应的pojo

订单号的生成

**解决方案一：**使用mysql的自增长，不能使用

优点：不需要我们自己生成订单，mysql会自动生成

缺点：如果订单表数量太大时需要分库分表，此时订单号会重复，如果输数据备份后在回复，订单号会变

**解决方案二：**日期+随机数

采用毫秒+随机数

缺点：仍然有重复的可能，不建议采用此方案

在没有更好的解决方案之前可以使用

**解决方案三：**使用uuid

优点：不会重复

缺点：长、可读性差、不建议使用

**解决方案四：**可读性好、不能太长、一般订单都是全数字的

可以使用redis的incr命令生成订单号

优点：不会重复

缺点：需要搭建redis服务器

OrderService.java

/taotao-order/src/main/java/com/taotao/order/service/OrderService.java

package com.taotao.order.service;

import java.util.List;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.pojo.TbOrder;
import com.taotao.pojo.TbOrderItem;
import com.taotao.pojo.TbOrderShipping;

public interface OrderService {
	/**
	 *  创建订单接口
	 */
	TaotaoResult createOrder(TbOrder order, List itemList, TbOrderShipping orderShipping);
}

OrderServiceImpl.java

/taotao-order/src/main/java/com/taotao/order/service/impl/OrderServiceImpl.java

package com.taotao.order.service.impl;

import java.util.Date;
import java.util.List;

import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;

import com.taotao.common.utill.TaotaoResult;
import com.taotao.mapper.TbOrderItemMapper;
import com.taotao.mapper.TbOrderMapper;
import com.taotao.mapper.TbOrderShippingMapper;
import com.taotao.order.dao.JedisClient;
import com.taotao.order.service.OrderService;
import com.taotao.pojo.TbOrder;
import com.taotao.pojo.TbOrderItem;
import com.taotao.pojo.TbOrderShipping;

/**
 * 订单管理Service
 *  创建订单接口
 * @author Lenovo
 *
 */
@Service
public class OrderServiceImpl implements OrderService {

	@Autowired
	private TbOrderMapper orderMapper;
	@Autowired
	private TbOrderItemMapper orderItemMapper;
	@Autowired
	private TbOrderShippingMapper orderShippingMapper;
	@Autowired
	private JedisClient jedisClient;
	
	@Value("${ORDER_GEN_KEY}")
	private String ORDER_GEN_KEY;
	@Value("${ORDER_INIT_ID}")
	private String ORDER_INIT_ID;
	@Value("${ORDER_DETAIL_GEN_KEY}")
	private String ORDER_DETAIL_GEN_KEY;
	
	
	@Override
	public TaotaoResult createOrder(TbOrder order, List itemList, TbOrderShipping orderShipping) {
		//向订单表中插入记录
		//获得订单号
		String string = jedisClient.get(ORDER_GEN_KEY);
		if (StringUtils.isBlank(string)) {
			jedisClient.set(ORDER_GEN_KEY, ORDER_INIT_ID);
		}
		long orderId = jedisClient.incr(ORDER_GEN_KEY);
		//补全pojo的属性
		order.setOrderId(orderId + "");
		//状态：1、未付款，2、已付款，3、未发货，4、已发货，5、交易成功，6、交易关闭
		order.setStatus(1);
		Date date = new Date();
		order.setCreateTime(date);
		order.setUpdateTime(date);
		//0：未评价 1：已评价
		order.setBuyerRate(0);
		//向订单表插入数据
		orderMapper.insert(order);
		//插入订单明细
		for (TbOrderItem tbOrderItem : itemList) {
			//补全订单明细
			//取订单明细id
			long orderDetailId = jedisClient.incr(ORDER_DETAIL_GEN_KEY);
			tbOrderItem.setId(orderDetailId + "");
			tbOrderItem.setOrderId(orderId + ""); 
			//向订单明细插入记录
			orderItemMapper.insert(tbOrderItem);
		}
		//插入物流表
		//补全物流表的属性
		orderShipping.setOrderId(orderId + "");
		orderShipping.setCreated(date);
		orderShipping.setUpdated(date);
		orderShippingMapper.insert(orderShipping);
		
		return TaotaoResult.ok(orderId);
	}

}

resource.properties

/taotao-order/src/main/resources/resource/resource.properties

#订单号生成的key
ORDER_GEN_KEY=ORDER_GEN_KEY
#初始化订单号
ORDER_INIT_ID=100544
#订单明细生成的key
ORDER_DETAIL_GEN_KEY=ORDER_DETAIL_GEN_KEY

2.4.4 controller

接受一个json格式的字符串作为参数，需要使用@RequestBody注解。需要使用一个pojo接受参数。创建一个对应json的pojo

Order.java

/taotao-order/src/main/java/com/taotao/order/pojo/Order.java

package com.taotao.order.pojo;

import java.util.List;

import com.taotao.pojo.TbOrder;
import com.taotao.pojo.TbOrderItem;
import com.taotao.pojo.TbOrderShipping;

public class Order extends TbOrder {

	private List orderItems;
	private TbOrderShipping orderShipping;
	public List getOrderItems() {
		return orderItems;
	}
	public void setOrderItems(List orderItems) {
		this.orderItems = orderItems;
	}
	public TbOrderShipping getOrderShipping() {
		return orderShipping;
	}
	public void setOrderShipping(TbOrderShipping orderShipping) {
		this.orderShipping = orderShipping;
	}
	
	
}

OrderController.java

/taotao-order/src/main/java/com/taotao/order/controller/OrderController.java

package com.taotao.order.controller;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import com.taotao.common.utill.ExceptionUtil;
import com.taotao.common.utill.TaotaoResult;
import com.taotao.order.pojo.Order;
import com.taotao.order.service.OrderService;

/**
 * 订单管理Service
 *  创建订单接口
 * @author Lenovo
 *
 */
@Controller
public class OrderController {

	@Autowired
	private OrderService orderService;
	
	@RequestMapping(value="/create", method=RequestMethod.POST)
	@ResponseBody
	public TaotaoResult createOrder(@RequestBody Order order) {
		try {
			TaotaoResult result = orderService.createOrder(order, order.getOrderItems(), order.getOrderShipping());
			return result;
		} catch (Exception e) {
			e.printStackTrace();
			return TaotaoResult.build(500, ExceptionUtil.getStackTrace(e));
		}
	}
}

3 前端系统实现下单功能

在 taotao-portal系统中添加商品至购物车中，点击提价订单调用taotao-order服务生成订单。向用户展示订单号，提示创建订单成功

3.1下单流程

3.2 购物车“去结算”按钮

cart.jsp

/taotao-portal/src/main/webapp/WEB-INF/jsp/cart.jsp

OrderController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/OrderController.java

package com.taotao.portal.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 *  前端系统实现下单功能
 *  购物车“去结算”按钮
 * @author Lenovo
 *
 */
@Controller
@RequestMapping("/order")
public class OrderController {
	
	@RequestMapping("/order-cart")
	public String showOrderCart() {
		return "order-cart";
	}
	
}

3.3 订单确认界面

要求用户登录
根据用户ID查询用户的收货地址列表
在此页面展示购物车的商品列表
需要计算订单的总金额（包括运费）

3.3.1要求用户登录

修改springmvc.xml拦截所有以：/order/**形式的url。

springmvc.xml

/taotao-portal/src/main/resources/spring/springmvc.xml

3.3.2 根据用户ID查询用户的收货地址列表

在实际的商城中是必须要有此功能，需要taotao-rest发布服务，由taotao-portal根据用户查询用户的收货地址列表

在此，使用静态数据模拟

3.3.3 在此页面展示购物车的商品列表

需要从cookie中把购物车商品列表取出，传递给order-cart.jsp

可以直接使用购物车服务，

OrderController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/OrderController.java

package com.taotao.portal.controller;

import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.service.CartService;

/**
 *  前端系统实现下单功能
 *  购物车“去结算”按钮
 * @author Lenovo
 *
 */
@Controller
@RequestMapping("/order")
public class OrderController {
	
	@Autowired
	private CartService cartService;
	
	/*
	 * 显示订单确认画面
	 */
	@RequestMapping("/order-cart")
	public String showOrderCart(HttpServletRequest request, HttpServletResponse response, Model model) {
		//取购物车商品列表
		List list = cartService.getCartItemList(request, response);
		//传递给页面
		model.addAttribute("cartList", list);
		
		return "order-cart";
	}
	
}

运行

报错：

order-cart.jsp

/taotao-portal/src/main/webapp/WEB-INF/jsp/order-cart.jsp

3.4 提交订单

3.4.1 需求分析

点击提交订单按钮，把用户已经确认的订单信息提交给后台。提交一个隐藏的表单，其中包含订单基本信息，订单名称以及配送信息。需要使用一个包装的pojo接收表单中的内容

order-cart.jsp

/taotao-portal/src/main/webapp/WEB-INF/jsp/order-cart.jsp

提交的url:/order/create.html

参数：表单的内容。使用order接收表单的内容

order即/taotao-order/src/main/java/com/taotao/order/pojo/Order.java

返回值：返回一个jsp页面

3.4.2 server

接受order对象，调用taotao-order提供的服务，提交订单，需要把pojo转换成json数据，调用taotao-order提供的服务返回taotaoresult。包含订单号。

参数：order

返回者：string(订单号)

Order.java

/taotao-portal/src/main/java/com/taotao/portal/pojo/Order.java

OrderService.java

/taotao-portal/src/main/java/com/taotao/portal/service/OrderService.java

package com.taotao.portal.service;

import com.taotao.portal.pojo.Order;

public interface OrderService {
	/*
	 * 提交订单
	 */
	String createOrder(Order order);
}

OrderServiceImpl.java

/taotao-portal/src/main/java/com/taotao/portal/service/impl/OrderServiceImpl.java

package com.taotao.portal.service.impl;

import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Service;

import com.taotao.common.utill.HttpClientUtil;
import com.taotao.common.utill.JsonUtils;
import com.taotao.common.utill.TaotaoResult;
import com.taotao.portal.pojo.Order;
import com.taotao.portal.service.OrderService;

/*
 * 提交订单
 */
@Service
public class OrderServiceImpl implements OrderService {
	
	@Value("${ORDER_BASE_URL}")
	private String ORDER_BASE_URL;
	@Value("${ORDER_CREATE_URL}")
	private String ORDER_CREATE_URL;
	

	@Override
	public String createOrder(Order order) {
		//调用创建订单服务之前补全用户信息。
		//从cookie中后取TT_TOKEN的内容，根据token调用sso系统的服务根据token换取用户信息。
		
		//调用taotao-order的服务提交订单。
		String json = HttpClientUtil.doPostJson(ORDER_BASE_URL + ORDER_CREATE_URL, JsonUtils.objectToJson(order));
		//把json转换成taotaoResult
		TaotaoResult taotaoResult = TaotaoResult.format(json);
		if (taotaoResult.getStatus() == 200) {
			Object orderId = taotaoResult.getData();
			return orderId.toString();
		}
		return "";
	}

}

resource.properties

【/taotao-portal】—【/src/main/resources/】—【resource/】—【resource.properties】

#订单系统基础url
ORDER_BASE_URL=http://localhost:8085/order
#创建订单服务
ORDER_CREATE_URL=/create

3.4.3 controller

OrderController.java

/taotao-portal/src/main/java/com/taotao/portal/controller/OrderController.java

package com.taotao.portal.controller;

import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.joda.time.DateTime;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.taotao.pojo.TbUser;
import com.taotao.portal.pojo.CartItem;
import com.taotao.portal.pojo.Order;
import com.taotao.portal.service.CartService;
import com.taotao.portal.service.OrderService;

/**
 *  前端系统实现下单功能
 *  购物车“去结算”按钮
 * @author Lenovo
 *
 */
@Controller
@RequestMapping("/order")
public class OrderController {
	
	@Autowired
	private CartService cartService;
	
	@Autowired
	private OrderService orderService;
	
	/*
	 * 显示订单确认画面
	 */
	@RequestMapping("/order-cart")
	public String showOrderCart(HttpServletRequest request, HttpServletResponse response, Model model) {
		//取购物车商品列表
		List list = cartService.getCartItemList(request, response);
		//传递给页面
		model.addAttribute("cartList", list);
		
		return "order-cart";
	}
	
	
	/*
	 * 提交订单
	 */
	@RequestMapping("/create")
	public String createOrder(Order order, Model model, HttpServletRequest request) {
		try {
			//从Request中取用户信息
			TbUser user = (TbUser) request.getAttribute("user");
			//在order对象中补全用户信息
			order.setUserId(user.getId());
			order.setBuyerNick(user.getUsername());
			//调用服务
			String orderId = orderService.createOrder(order);
			model.addAttribute("orderId", orderId);
			model.addAttribute("payment", order.getPayment());
			model.addAttribute("date", new DateTime().plusDays(3).toString("yyyy-MM-dd"));
			return "success";
			
		} catch (Exception e) {
			e.printStackTrace();
			model.addAttribute("message", "创建订单出错。请稍后重试！");
			return "error/exception";
		}
	}
	
}

测试

你可能感兴趣的:(Java项目-淘淘商城)

LeetCode github集合，附CMU大神整理笔记 Wesley@ LeetCode github
GithubLeetCode集合本人所有做过的题目都写在一个java项目中，同步到github中了，算是见证自己的进步。github目前同步的题目是2020-09-17日之后写的题。之前写过的题会陆续跟新到github中。目前大概400个题目Github项目链接：https://github.com/sunliancheng/leetcode_github附上一份优秀的教材整合：这是卡内基梅隆(C
分享一个基于python的电子书数据采集与可视化分析 hadoop电子书数据分析与推荐系统 spark大数据毕设项目（源码、调试、LW、开题、PPT) 计算机源码社 Python项目大数据大数据 python hadoop 计算机毕业设计选题计算机毕业设计源码数据分析 spark毕设
作者：计算机源码社个人简介：本人八年开发经验，擅长Java、Python、PHP、.NET、Node.js、Android、微信小程序、爬虫、大数据、机器学习等，大家有这一块的问题可以一起交流！学习资料、程序开发、技术解答、文档报告如需要源码，可以扫取文章下方二维码联系咨询Java项目微信小程序项目Android项目Python项目PHP项目ASP.NET项目Node.js项目选题推荐项目实战|p
Java 基于 SpringBoot+vue 的大学生科创项目在线管理系统（附源码）程序员徐师兄 java spring boot vue.js 大学生科创项目管理系统大学生科创项目
博主介绍：✌程序员徐师兄、7年大厂程序员经历。全网粉丝12w+、csdn博客专家、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌文末获取源码联系精彩专栏推荐订阅不然下次找不到哟2022-2024年最全的计算机软件毕业设计选题大全：1000个热门选题推荐✅Java项目精品实战案例《100套》Java微信小程序项目实战《100套》Python项目实战《100套》
kubernetes里面那些事—————存储背锅攻城师 kubernetes 容器云原生
常用数据卷类型一，emptyDir1.1，emptyDir概念1.2，应用场景1.3，yaml示例二，hostPath2.1，hostPath概念2.2，应用场景2.3，yaml示例三，congfigmap3.1，configmap的作用3.2，注意事项：3.3，使用configmap创建java项目配置文件3.4，subPath应用3.5，configmap作为环境变量四，secret4.1，s
Java项目中参数校验方法 DebugDiver代码深处潜水员项目相关 java python 开发语言
Java项目中参数校验方法1.参数校验的重要性2.常见的参数校验方法2.1使用`assert`关键字2.2使用`Objects.requireNonNull`2.3使用自定义异常2.4使用`Preconditions`类2.5使用HibernateValidator注解2.6使用Spring框架内的验证2.7使用JSR303/349（BeanValidation）2.8使用ApacheCommon
领域驱动设计（DDD）在Java项目中的实践省赚客app开发者 java python 开发语言
领域驱动设计（DDD）在Java项目中的实践大家好，我是微赚淘客系统3.0的小编，是个冬天不穿秋裤，天冷也要风度的程序猿！领域驱动设计（Domain-DrivenDesign，简称DDD）是一种软件开发方法，旨在通过对业务领域的深入理解，构建高内聚、低耦合的系统。在Java项目中，DDD可以帮助我们更好地组织代码，清晰地表达业务逻辑。本文将通过代码示例，展示如何在Java项目中实践领域驱动设计。什
Java领域驱动设计 star.29 java 数据库开发语言
Java领域驱动设计在Java项目中实现领域驱动设计（Domain-DrivenDesign，简称DDD）时，通常会遵循一套特定的结构和原则来构建应用程序。DDD结构旨在通过深入理解业务领域来指导软件开发过程，使软件系统更加符合业务需求，同时提高代码的可维护性、可扩展性和可测试性。核心概念与原则1.领域模型：对业务领域的抽象描述，包括实体（Entity）、值对象（ValueObject）、聚合（A
Java项目——苍穹外卖（一）懒阳羊数据库 java spring spring boot
Entity、DTO、VOEntity（实体）Entity是表示数据库表的对象，通常对应数据库中的一行数据。它通常包含与数据库表对应的字段，并可能包含一些业务逻辑。DTO（数据传输对象）作用：DTO是用于在不同层之间传输数据的对象，通常用于网络传输或服务间调用。DTO主要用于减少网络请求的次数，携带数据而不包含业务逻辑。特点：DTO类通常只包含数据字段和相应的getter和setter方法，不包含
Maven项目结构说明 HachiLin SpringBoot maven springboot 微服务
1.maven概念是一个基于Java平台的自动化构建工具（make->ant->maven->gradle，它主要有五大功能：（1）清理：删除编译的结果，为重新编译做准备（2）编译：java->class（3）测试：针对与项目中的关键点进行测试，方便开发人员与测试人员交互（4）报告：将测试结果进行显示（5）打包：将项目中包含的多个文件压缩成一个文件，用于安装或部署（java项目打成jar包，web
分享一个基于微信小程序的智慧校园服务平台（源码、调试、LW、开题、PPT）计算机源码社微信小程序微信小程序毕业设计项目计算机毕设源码计算机毕设毕设选题课程设计源码毕业设计答辩
作者：计算机源码社个人简介：本人八年开发经验，擅长Java、Python、PHP、.NET、Node.js、Android、微信小程序、爬虫、大数据、机器学习等，大家有这一块的问题可以一起交流！学习资料、程序开发、技术解答、文档报告如需要源码，可以扫取文章下方二维码联系咨询Java项目微信小程序项目Android项目Python项目PHP项目ASP.NET项目Node.js项目选题推荐项目实战|基
Java项目：144 基于springboot医疗报销系统的设计与实现舒克日记 java java spring boot 开发语言
作者主页：舒克日记简介：Java领域优质创作者、Java项目、学习资料、技术互助文中获取源码项目介绍本医疗报销系统分为管理员还有用户两个权限管理员可以管理用户的基本信息内容，可以管理公告信息以及公告的租赁信息，能够与用户进行相互交流等操作，用户可以查看报销单信息，可以查看公告以及查看管理员回复信息等操作。环境要求1.运行环境：最好是javajdk1.8,我们在这个平台上运行的。其他版本理论上也可以
最新计算机专业开题报告案例88：社区垃圾分类智能小程序的设计与实现平姐设计计算机毕业设计100套微信小程序项目实战 java项目实战小程序积分兑换商城获取定位在线答题云数据库百度AI接口研究方法
计算机毕业设计100套微信小程序项目实战java项目实战需要源码可以滴滴我项目演示地址目录一、研究目的与意义1.1目的1.2意义二、研究现状与文献综述2.1关于同类系统内容相关的研究2.2关于同类系统技术相关的研究三、研究的主要内容、预期目标与创新点3.1研究的主要内容3.2预期目标3.3创新点四、研究思路、研究方法与研究计划4.1研究思路4.2研究方法4.3研究计划一、研究目的与意义1.1目的近
最新计算机专业开题报告案例89：基于微信小程序的公考学习系统的设计与实现平姐设计微信小程序项目实战计算机毕业设计100套 php项目开发实战微信小程序 laravel框架 php 每日打卡今日练习拟解决的关键问题论文提纲
计算机毕业设计100套微信小程序项目实战java项目实战需要源码可以滴滴我项目演示地址目录一、研究的目的、意义和实用价值1.1研究目的1.2研究意义1.3实用价值二、国内外研究现状2.1国内研究现状2.2国外研究现状三、主要研究内容（提纲）四、已做哪些准备工作，计划再做的工作4.1已经做好的准备工作4.2计划再做的工作五、拟解决的关键问题六、主要参考文献一、研究的目的、意义和实用价值1.1研究目的
父类是给java项目SpringCloud微服务中SpringBoot解决继承父类后 maven标红不太会写 java spring boot spring cloud
解决继承父类后maven标红问题:Project:org.example:SpringCloud_wfw:1.0-SNAPSHOTLocation::X:/SpringCloud_微服务/pom.xmlProblems:'packaging'withvalue'jar'isinvalid.Aggregatorprojectsrequire'pom'a父类中packaging改成pomMaven父类
构建工具之Maven的使用(一) IT大狮兄
一、前言对于开发一个Java项目，上线之前会通过编译，测试，打包，部署这几个构建过程，如果文件较少，我们可以使用java-->javac-->jar这些命令去完成上述的构建流程。但是当工程越来越大，文件越来越多。Java原生的命令就显得捉襟见肘，力不存心了。Maven基于POM管理jar包依赖，通过自身的生命周期实现项目的构建流程。具体构建原理可自行百度/谷歌。本文主要为大家分享一些比较实用的ma
2024年计算机毕业设计2000个热门选题推荐之NodeJS篇——全行业Java项目定制asp.net代做Python安卓NodeJS等 itszkt计算机项目源代码项目选题课程设计 java 开发语言
✌精彩专栏推荐订阅以防找不到✌项目界面文字不会改？项目代码不懂？怕老师问？项目没有软件？不会运行？✌选题—项目修改教程—答疑—远程，为客户提供帮助和支持，努力解决问题和推动项目进展✌✌✌选题推荐——以防找不到我们，点击上方订阅专栏✌✌2024年计算机JavaPython安卓APP微信小程序asp.net项目PHP2000+热门选题推荐计算机毕业设计如何选题？计算机毕业设计开题报告如何书写论文的书写
Java面向对象编程——新手必看 _S_Q 后端服务 Java java python 开发语言
文章目录Java面向对象编程博客一、面向对象编程的四大基本原则二、示例程序：动物类继承与多态1.创建一个新的Java项目2.编写代码3.运行程序三、继承与多态的深度解析四、总结Java面向对象编程博客面向对象编程（OOP）是Java的核心概念之一，它通过封装、继承和多态来帮助开发者构建模块化和可维护的代码。本篇博客将通过示例程序、UML类图，以及使用IntelliJIDEA的实践，详细讲解Java
使用Docker构建支持中文字体的Java镜像 DN金猿 docker docker java 文字方框
做停车场生成二维码时，在代码中用到在图片上添加文字或水印，文字在本地正常显示，到linux服务器就显示方框，由于我用的是docker部署的java项目，所以在linux服务器中安装了中文字体还是无效，因为项目是部署中docker容器里。Fontfont3=newFont("微软雅黑",Font.PLAIN,72);微软雅黑字体显示方框（方框部分是添加的文字）后来查了很多资料，发现都不行。因为我的D
Maven基本使用 unhurried人生——冕临 Java java maven
Maven简介Maven是一款为Java项目管理构建、依赖管理的工具，使用Maven可以自动化构建、测试、打包和发布项目，大大提高了开发效率和质量。Maven可以管理项目的依赖，包括自动下载所需依赖库、自动下载依赖需要的依赖并且保证版本没有冲突、依赖版本管理等。通过Maven，开发人员可以方便地维护项目所依赖的外部库，避免版本冲突和转换错误等，而开发人员仅仅需要编写配置即可。Maven可以管理项目
Maven学习（零基础到面试） Heath-ceTide maven 学习 java
1.什么是Maven?maven是一款用于管理和构建java项目的工具2.Maven的作用？1.依赖管理：方便快捷的管理项目以来的资源（jar包），避免版本冲突问题。以前的项目需要创建lib包，将网上的jar包资源放入其中使用，但是开发后期太过繁琐并且可能出现版本冲突问题2.统一项目结构：提供标准，统一的项目结构。因为不同编译器创建出来的项目会有不同，eclipse创建出来的项目在idea中无法直
2024年计算机毕业设计2000个热门选题推荐之Python爬虫数据分析可视化大屏篇——全行业Java项目定制asp.net代做Python安卓NodeJS等 itszkt计算机项目源代码项目选题课程设计 java 开发语言 python django 计算机毕业设计
✌精彩专栏推荐订阅以防找不到✌项目界面文字不会改？项目代码不懂？怕老师问？项目没有软件？不会运行？✌选题—项目修改教程—答疑—远程，为客户提供帮助和支持，努力解决问题和推动项目进展✌选题推荐——以防找不到我们，点击上方订阅专栏✌✌2024年计算机JavaPython安卓APP微信小程序asp.net项目PHP2000+热门选题推荐计算机毕业设计如何选题？计算机毕业设计开题报告如何书写论文的书写如何
阿里nacos的使用笔记（一） JohnYuCN
一、定位：它是一个Service的：注册发现管理、配置管理的服务器。自身是用SpringBoot的完在的Java项目有着“独立和集群”两种启动模式。采用Derby(standalone模式)或Mysql(Cluster模式)做为持久化存储方案。其管理的服务可以是：（1）SpringBoot微服务（2)K8S的Service（3）Doubbo的RPCService二、安装与启停管理：下载：可以从ht
理解 Maven 依赖范围及编译与运行时的需求 CodeDunkster maven java
在使用Maven构建Java项目时，我们经常需要添加各种依赖（JAR包）到项目中。然而，依赖的作用范围（Scope）决定了这些JAR包在不同阶段的作用和存在方式。本文将详细介绍Maven依赖范围的定义、编译和运行时的需求，以及如何正确理解这些概念。Maven依赖范围（Scope）在Maven的pom.xml文件中，依赖的scope元素用来定义该依赖的作用范围。常见的作用范围包括：compile：默
如何使用Smart-Doc高效生成Java WebSocket接口文档 shalousun smart-doc java websocket java文档工具零注解
前言Smart-Doc是一款强大的文档生成工具，可以帮助开发者轻松地为Java项目生成清晰、详细的API文档。随着WebSocket技术的普及，Smart-Doc在3.0.7版本开始也增加了对WebSocket接口的支持。本文将详细介绍如何使用Smart-Doc生成JavaWebSocket接口的文档，并提供一个完整的WebSocket服务端示例。WebSocket技术概览首先，让我们简单了解一下
使用EasyExcel进行单元格合并 DevNinja python 开发语言 Java
在Java中，我们可以使用EasyExcel库来处理Excel文件。EasyExcel是一款功能强大且易于使用的Java库，可以帮助我们读取、写入和操作Excel文件。在本文中，我们将介绍如何使用EasyExcel来合并单元格。首先，我们需要添加EasyExcel库的依赖。你可以下载最新版本的EasyExcelJAR文件，并将其添加到你的Java项目中。接下来，我们将展示如何使用EasyExcel
Maven 快照（SNAPSHOT） lly202406 开发语言
Maven快照（SNAPSHOT）1.引言在Java项目开发中，Maven是一个广泛使用的构建工具和依赖管理器。它通过一个中央仓库来管理项目的依赖项，使得开发者可以轻松地添加、更新和删除依赖。在Maven中，快照（SNAPSHOT）是一个特殊的版本标识，用于表示一个正在开发中的版本。本文将详细介绍Maven快照的概念、用途、以及如何使用快照。2.快照的概念在Maven中，每个依赖都有一个唯一的坐标
基于SpringBoot的流浪猫狗救援网站超级无敌暴龙战士塔塔开 Java课设与毕设资源 java
文章目录项目介绍主要功能截图：部分代码展示设计总结项目获取方式作者主页：超级无敌暴龙战士塔塔开简介：Java领域优质创作者、简历模板、学习资料、面试题库【关注我，都给你】文末获取源码联系项目介绍基于SpringBoot的流浪猫狗救援网站,java项目。eclipse和idea都能打开运行。推荐环境配置：eclipse/ideajdk1.8mavenmysql前端技术：vue，Ajax，Json后端
Maven：解决 The plugin org.codehaus.mojo:flatten-maven-plugin:1.5.0 requires Maven version 3.5.4 dingcho 工具 SpringCloud maven java idea
今天我们在拉一个Java项目基于rouyi的架子，结果拉下打包的时候报错其实这个问题很好解决，这个错误是由于依赖的flatten-maven-plugin需要Maven3.5.4+本人之前使用的是3.5.3所以重新去下载了一个3.5.4+版本重新配置下保存，即可打包成功了。
服务器（百度云）部署项目（jar包）码农sssss jar java
java项目打包成jar包：clean------compile------installjar包上传到服务器上和jar包相同的文件里，创建Dockerfile文件。Dockerfile文件的内容informationerasure是jar包名，这里可根据自己定义的名字进行更换。Dockerfile文件内容，如下：FROMopenjdk:8-jdk-alpineVOLUME/tmp##时区RUNe
来了!!!来了!!!--我需要在Docker中运行Java应用程序，但是没有Docker经验，你能给我一个简单的入门指南吗？橙-极纪元JJY.Cheng java docker java 容器
在Docker中运行Java应用程序的简单入门指南：1.安装Docker首先，确保你的系统上安装了Docker。你可以从Docker官网下载并安装适合你操作系统的Docker版本。Windows10安装Docker，每个步骤作者亲测，细节记录最全教程2.编写DockerfileDockerfile是一个文本文件，包含了构建Docker镜像的所有指令。在你的Java项目根目录下创建一个名为Docke
项目中枚举与注解的结合使用飞翔的马甲 java enum annotation
前言：版本兼容，一直是迭代开发头疼的事，最近新版本加上了支持新题型，如果新创建一份问卷包含了新题型，那旧版本客户端就不支持，如果新创建的问卷不包含新题型，那么新旧客户端都支持。这里面我们通过给问卷类型枚举增加自定义注解的方式完成。顺便巩固下枚举与注解。一、枚举 1.在创建枚举类的时候，该类已继承java.lang.Enum类，所以自定义枚举类无法继承别的类，但可以实现接口。
【Scala十七】Scala核心十一：下划线_的用法 bit1129 scala
下划线_在Scala中广泛应用，_的基本含义是作为占位符使用。_在使用时是出问题非常多的地方，本文将不断完善_的使用场景以及所表达的含义 1. 在高阶函数中使用 scala> val list = List(-3,8,7,9) list: List[Int] = List(-3, 8, 7, 9) scala> list.filter(_ > 7) r
web缓存基础：术语、http报头和缓存策略 dalan_123 Web
对于很多人来说，去访问某一个站点，若是该站点能够提供智能化的内容缓存来提高用户体验，那么最终该站点的访问者将络绎不绝。缓存或者对之前的请求临时存储，是http协议实现中最核心的内容分发策略之一。分发路径中的组件均可以缓存内容来加速后续的请求，这是受控于对该内容所声明的缓存策略。接下来将讨web内容缓存策略的基本概念，具体包括如如何选择缓存策略以保证互联网范围内的缓存能够正确处理的您的内容，并谈论下
crontab 问题周凡杨 linux crontab unix
一： 0481-079 Reached a symbol that is not expected. 背景： */5 * * * * /usr/IBMIHS/rsync.sh
让tomcat支持2级域名共享session g21121 session
tomcat默认情况下是不支持2级域名共享session的，所有有些情况下登陆后从主域名跳转到子域名会发生链接session不相同的情况，但是只需修改几处配置就可以了。打开tomcat下conf下context.xml文件找到Context标签,修改为如下内容如果你的域名是www.test.com <Context sessionCookiePath="/path&q
web报表工具FineReport常用函数的用法总结（数学和三角函数）老A不折腾 Web finereport 总结
ABS ABS(number):返回指定数字的绝对值。绝对值是指没有正负符号的数值。 Number:需要求出绝对值的任意实数。示例: ABS(-1.5)等于1.5。 ABS(0)等于0。 ABS(2.5)等于2.5。 ACOS ACOS(number):返回指定数值的反余弦值。反余弦值为一个角度，返回角度以弧度形式表示。 Number:需要返回角
linux 启动java进程 sh文件墙头上一根草 linux shell jar
#!/bin/bash #初始化服务器的进程PId变量 user_pid=0; robot_pid=0; loadlort_pid=0; gateway_pid=0; ######### #检查相关服务器是否启动成功 #说明： #使用JDK自带的JPS命令及grep命令组合，准确查找pid #jps 加 l 参数，表示显示java的完整包路径 #使用awk，分割出pid
我的spring学习笔记5-如何使用ApplicationContext替换BeanFactory aijuans Spring 3 系列
如何使用ApplicationContext替换BeanFactory？ package onlyfun.caterpillar.device; import org.springframework.beans.factory.BeanFactory; import org.springframework.beans.factory.xml.XmlBeanFactory; import
Linux 内存使用方法详细解析 annan211 linux 内存 Linux内存解析
来源 http://blog.jobbole.com/45748/ 我是一名程序员，那么我在这里以一个程序员的角度来讲解Linux内存的使用。一提到内存管理，我们头脑中闪出的两个概念，就是虚拟内存，与物理内存。这两个概念主要来自于linux内核的支持。 Linux在内存管理上份为两级，一级是线性区，类似于00c73000-00c88000，对应于虚拟内存，它实际上不占用
数据库的单表查询常用命令及使用方法(-) 百合不是茶 oracle 函数单表查询
创建数据库; --建表 create table bloguser(username varchar2(20),userage number(10),usersex char(2)); 创建bloguser表,里面有三个字段 &nbs
多线程基础知识 bijian1013 java 多线程 thread java多线程
一．进程和线程进程就是一个在内存中独立运行的程序，有自己的地址空间。如正在运行的写字板程序就是一个进程。 “多任务”：指操作系统能同时运行多个进程（程序）。如WINDOWS系统可以同时运行写字板程序、画图程序、WORD、Eclipse等。线程：是进程内部单一的一个顺序控制流。线程和进程 a. 每个进程都有独立的
fastjson简单使用实例 bijian1013 fastjson
一.简介阿里巴巴fastjson是一个Java语言编写的高性能功能完善的JSON库。它采用一种“假定有序快速匹配”的算法，把JSON Parse的性能提升到极致，是目前Java语言中最快的JSON库；包括“序列化”和“反序列化”两部分，它具备如下特征：
【RPC框架Burlap】Spring集成Burlap bit1129 spring
Burlap和Hessian同属于codehaus的RPC调用框架，但是Burlap已经几年不更新，所以Spring在4.0里已经将Burlap的支持置为Deprecated,所以在选择RPC框架时，不应该考虑Burlap了。这篇文章还是记录下Burlap的用法吧，主要是复制粘贴了Hessian与Spring集成一文，【RPC框架Hessian四】Hessian与Spring集成
【Mahout一】基于Mahout 命令参数含义 bit1129 Mahout
1. mahout seqdirectory $ mahout seqdirectory --input (-i) input Path to job input directory(原始文本文件). --output (-o) output The directory pathna
linux使用flock文件锁解决脚本重复执行问题 ronin47 linux lock　重复执行
linux的crontab命令，可以定时执行操作，最小周期是每分钟执行一次。关于crontab实现每秒执行可参考我之前的文章《linux crontab 实现每秒执行》现在有个问题，如果设定了任务每分钟执行一次，但有可能一分钟内任务并没有执行完成，这时系统会再执行任务。导致两个相同的任务在执行。例如： <? // test .php
java-74-数组中有一个数字出现的次数超过了数组长度的一半，找出这个数字 bylijinnan java
public class OcuppyMoreThanHalf { /** * Q74 数组中有一个数字出现的次数超过了数组长度的一半，找出这个数字 * two solutions: * 1.O(n) * see <beauty of coding>--每次删除两个不同的数字，不改变数组的特性 * 2.O(nlogn) * 排序。中间
linux 系统相关命令 candiio linux
系统参数 cat /proc/cpuinfo cpu相关参数 cat /proc/meminfo 内存相关参数 cat /proc/loadavg 负载情况性能参数 1）top M：按内存使用排序 P：按CPU占用排序 1：显示各CPU的使用情况 k：kill进程 o：更多排序规则回车：刷新数据 2）ulimit ulimit -a：显示本用户的系统限制参
[经营与资产]保持独立性和稳定性对于软件开发的重要意义 comsci 软件开发
一个软件的架构从诞生到成熟，中间要经过很多次的修正和改造如果在这个过程中，外界的其它行业的资本不断的介入这种软件架构的升级过程中那么软件开发者原有的设计思想和开发路线
在CentOS5.5上编译OpenJDK6 Cwind linux OpenJDK
几番周折终于在自己的CentOS5.5上编译成功了OpenJDK6，将编译过程和遇到的问题作一简要记录，备查。 0. OpenJDK介绍 OpenJDK是Sun（现Oracle）公司发布的基于GPL许可的Java平台的实现。其优点： 1、它的核心代码与同时期Sun（-> Oracle）的产品版基本上是一样的，血统纯正，不用担心性能问题，也基本上没什么兼容性问题；（代码上最主要的差异是
java乱码问题 dashuaifu java乱码问题 js中文乱码
swfupload上传文件参数值为中文传递到后台接收中文乱码在js中用setPostParams（{"tag" : encodeURI( document.getElementByIdx_x("filetag").value，"utf-8")}）; 然后在servlet中String t
cygwin很多命令显示command not found的解决办法 dcj3sjt126com cygwin
cygwin很多命令显示command not found的解决办法修改cygwin.BAT文件如下 @echo off D: set CYGWIN=tty notitle glob set PATH=%PATH%;d:\cygwin\bin;d:\cygwin\sbin;d:\cygwin\usr\bin;d:\cygwin\usr\sbin;d:\cygwin\us
[介绍]从 Yii 1.1 升级 dcj3sjt126com PHP yii2
2.0 版框架是完全重写的，在 1.1 和 2.0 两个版本之间存在相当多差异。因此从 1.1 版升级并不像小版本间的跨越那么简单，通过本指南你将会了解两个版本间主要的不同之处。如果你之前没有用过 Yii 1.1，可以跳过本章，直接从"入门篇"开始读起。请注意，Yii 2.0 引入了很多本章并没有涉及到的新功能。强烈建议你通读整部权威指南来了解所有新特性。这样有可能会发
Linux SSH免登录配置总结 eksliang ssh-keygen Linux SSH免登录认证 Linux SSH互信
转载请出自出处：http://eksliang.iteye.com/blog/2187265 一、原理我们使用ssh-keygen在ServerA上生成私钥跟公钥，将生成的公钥拷贝到远程机器ServerB上后,就可以使用ssh命令无需密码登录到另外一台机器ServerB上。生成公钥与私钥有两种加密方式，第一种是
手势滑动销毁Activity gundumw100 android
老是效仿ios，做android的真悲催！有需求：需要手势滑动销毁一个Activity 怎么办尼？自己写？不用~，网上先问一下百度。结果： http://blog.csdn.net/xiaanming/article/details/20934541 首先将你需要的Activity继承SwipeBackActivity，它会在你的布局根目录新增一层SwipeBackLay
JavaScript变换表格边框颜色 ini JavaScript html Web html5 css
效果查看：http://hovertree.com/texiao/js/2.htm代码如下，保存到HTML文件也可以查看效果： <html> <head> <meta charset="utf-8"> <title>表格边框变换颜色代码-何问起</title> </head> <body&
Kafka Rest : Confluent kane_xie kafka REST confluent
最近拿到一个kafka rest的需求，但kafka暂时还没有提供rest api（应该是有在开发中，毕竟rest这么火），上网搜了一下，找到一个Confluent Platform，本文简单介绍一下安装。这里插一句，给大家推荐一个九尾搜索，原名叫谷粉SOSO，不想fanqiang谷歌的可以用这个。以前在外企用谷歌用习惯了，出来之后用度娘搜技术问题，那匹配度简直感人。环境声明：Ubu
Calender不是单例 men4661273 单例 Calender
在我们使用Calender的时候，使用过Calendar.getInstance()来获取一个日期类的对象，这种方式跟单例的获取方式一样，那么它到底是不是单例呢，如果是单例的话，一个对象修改内容之后，另外一个线程中的数据不久乱套了吗？从试验以及源码中可以得出，Calendar不是单例。测试： Calendar c1 =
线程内存和主内存之间联系 qifeifei java thread
1， java多线程共享主内存中变量的时候，一共会经过几个阶段， lock:将主内存中的变量锁定，为一个线程所独占。 unclock:将lock加的锁定解除，此时其它的线程可以有机会访问此变量。 read:将主内存中的变量值读到工作内存当中。 load:将read读取的值保存到工作内存中的变量副本中。
schedule和scheduleAtFixedRate tangqi609567707 java timer schedule
原文地址：http://blog.csdn.net/weidan1121/article/details/527307 import java.util.Timer;import java.util.TimerTask;import java.util.Date; /** * @author vincent */public class TimerTest {
erlang 部署 wudixiaotie erlang
1.如果在启动节点的时候报这个错： {"init terminating in do_boot",{'cannot load',elf_format,get_files}} 则需要在reltool.config中加入 {app, hipe, [{incl_cond, exclude}]}, 2.当generate时，遇到： ERROR

第十一天-购物车订单系统的实现

目录

1 购物车功能

1.1 功能说明

1.2 功能分析

1.3 添加购物车商品

1.3.1 service

CartItem.java

CartService.java

CartServiceImpl.java

1.3.2 controller

CartController.java

1.3.3 添加购物车成功页面

cartSuccess.jsp

商品已成功加入购物车！

base.css

initcart20150123.css

测试

1.4 展示购物车商品

1.4.1 server

CartService.java

CartServiceImpl.java

1.4.2 controller

CartController.java

测试

cart.jsp

CartController.java

1.5 修改商品数量

cart.jsp

cart.js

1.6 删除购物车商品

1.6.1 server

CartService.java

CartServiceImpl.java

1.6.2 controller

CartController.java

测试

1.7 购物车存在的问题

2 订单系统实现

2.1 订单表结构

订单表tb_order

订单商品表：tb_order_item

物流表：tb_order_shipping

2.2订单系统功能

2.3 taotao-order

2.3.1 框架整合

SqlMapConfig.xml

db.properties

resource.properties

applicationContext-dao.xml

applicationContext-jedis.xml

applicationContext-service.xml

applicationContext-trans.xml

springmvc.xml

pom.xml

web.xml

2.4 创建订单接口

2.4.1 接口说明

2.4.2 dao

2.4.3 server

OrderService.java

OrderServiceImpl.java

resource.properties

2.4.4 controller

Order.java

OrderController.java

3 前端系统实现下单功能

3.1下单流程

3.2 购物车“去结算”按钮

cart.jsp

OrderController.java

3.3 订单确认界面

3.3.1要求用户登录

springmvc.xml

3.3.2 根据用户ID查询用户的收货地址列表

3.3.3 在此页面展示购物车的商品列表

OrderController.java

order-cart.jsp

3.4 提交订单

3.4.1 需求分析