最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

SSH框架網(wǎng)上商城項目第14戰(zhàn)之商城首頁UI的設計

 更新時間:2016年06月03日 14:15:30   投稿:lijiao  
這篇文章主要為大家詳細介紹了SSH框架網(wǎng)上商城項目第14戰(zhàn)之商城首頁UI的設計,感興趣的小伙伴們可以參考一下

前面我們利用EasyUI和SSH搭建好了后臺的基本框架,做好了后臺的基本功能,包括對商品類別的管理和商品的管理等,這一節(jié)我們開始搭建前臺頁面。
做首頁的思路:假設現(xiàn)在商品的業(yè)務邏輯都有了,首先我們需要創(chuàng)建一個監(jiān)聽器,在項目啟動時將首頁的數(shù)據(jù)查詢出來放到application里,即在監(jiān)聽器里調(diào)用后臺商品業(yè)務邏輯的方法。

1.  首頁商品顯示邏輯
在首頁,我們只顯示商品熱點類別中的前幾個商品,比如熱點類別有兒童休閑類,女性休閑類,男性休閑類,那我們會有三個板塊來顯示不同的商品類,每個類別里再顯示幾個具體的商品。如果要實現(xiàn)這樣的首頁的話,我們需要將哪些數(shù)據(jù)查詢出來呢?首先肯定是熱點類別,即在數(shù)據(jù)庫中查詢類別是熱點的項,然后再從數(shù)據(jù)庫中根據(jù)熱點類別級聯(lián)查詢該類別的商品,這樣我們所要的數(shù)據(jù)就都有了。下面我們先在后臺完成這些查詢業(yè)務:

//CategoryService接口 
public interface CategoryService extends BaseService<Category> { 
 //省略其他方法…… 
 //根據(jù)boelen值查詢熱點或非熱點類別 
 public List<Category> queryByHot(boolean hot); 
} 
 
@SuppressWarnings("unchecked") 
@Service("categoryService") 
public class CategoryServiceImpl extends BaseServiceImpl<Category> implements CategoryService { 
 
 //省略其他方法…… 
 
 @Override 
 public List<Category> queryByHot(boolean hot) { 
  String hql = "from Category c where c.hot=:hot"; 
  return getSession().createQuery(hql) 
   .setBoolean("hot", hot) 
   .list(); 
 } 
} 
//ProductService接口 
public interface ProductService extends BaseService<Product> { 
  
 //省略其他方法…… 
 //根據(jù)熱點類別查詢推薦商品(僅僅查詢前4個) 
 public List<Product> querByCategoryId(int cid); 
} 
 
@SuppressWarnings("unchecked") 
@Service("productService") 
public class ProductServiceImpl extends BaseServiceImpl<Product> implements ProductService { 
 
 //省略其他方法…… 
 
 @Override 
 public List<Product> querByCategoryId(int cid) { 
  String hql = "from Product p join fetch p.category " 
    + "where p.commend=true and p.open=true and p.category.id=:cid order by p.date desc"; 
  return getSession().createQuery(hql) 
   .setInteger("cid", cid) 
   .setFirstResult(0) 
   .setMaxResults(4) 
   .list(); 
 } 
 
} 

2. 創(chuàng)建InitDataListener獲取首頁數(shù)據(jù)
后臺完成了商品的顯示邏輯業(yè)務,下面我們開始獲取所需要的數(shù)據(jù)了。首先創(chuàng)建一個監(jiān)聽器InitDataListener繼承ServletContextListener,關于監(jiān)聽器如何獲取Spring配置文件,請參考這篇博文:監(jiān)聽器如何獲取Spring配置文件

//@Component //監(jiān)聽器是web層的組件,它是tomcat實例化的,不是Spring實例化的。不能放到Spring中 
public class InitDataListener implements ServletContextListener { 
  
 private ProductService productService = null; 
 private CategoryService categoryService = null; 
 private ApplicationContext context = null; 
  
 @Override 
 public void contextDestroyed(ServletContextEvent event) { 
  // TODO Auto-generated method stub 
 
 } 
 
 @Override 
 public void contextInitialized(ServletContextEvent event) { 
 
  context = WebApplicationContextUtils.getWebApplicationContext(event.getServletContext());   
  categoryService = (CategoryService) context.getBean("categoryService");//加載類別信息   
  productService = (ProductService) context.getBean("productService");//加載商品信息 
 
  List<List<Product>> bigList = new ArrayList<List<Product>>(); //bigList中存放一個裝有Category類的list 
  // 1. 查詢出熱點類別 
  for(Category category : categoryService.queryByHot(true)) { 
   //根據(jù)熱點類別id獲取推薦商品信息 
   List<Product> lst = productService.querByCategoryId(category.getId()); 
   bigList.add(lst); //將裝有category的list放到bigList中 
  } 
  // 2. 把查詢的bigList交給application內(nèi)置對象 
  event.getServletContext().setAttribute("bigList", bigList); 
 } 
 
} 


 好了,現(xiàn)在數(shù)據(jù)全都放到bigList這個集合中了。

3.首頁UI頁面設計

UI首頁我們會從美工那拿到模板,這個模板是html,我們要做的就是將其改成我們的jsp,然后將bigList集合中的數(shù)據(jù)顯示在首頁上。首先我們將模板所需要的圖片和css拷貝到WebRoot目錄下,然后在WebRoot/public/head.jspf中將這兩個文件引入即可,因為head.jspf是其他頁面都要包含進來的公共頭:


然后將模板中的html嵌到前臺首頁index.jsp中去,使用jstl標簽修改一下顯示內(nèi)容,如下所示(只截圖顯示商品那一部分):


現(xiàn)在我們進入之前做好的后臺添加商品頁面,在女性休閑類添加幾個商品,然后啟動tomcat,運行一下首頁index.jsp,效果如下:

 好了,前臺的UI界面算是搭好了,接下來就是完成一些不同的業(yè)務了。

原文地址:http://blog.csdn.net/eson_15/article/details/51373403

以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。

相關文章

  • Spring Boot靜態(tài)資源路徑的配置與修改詳解

    Spring Boot靜態(tài)資源路徑的配置與修改詳解

    最近在做SpringBoot項目的時候遇到了“白頁”問題,通過查資料對SpringBoot訪問靜態(tài)資源做了總結(jié),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2022-09-09
  • java使用Jdom實現(xiàn)xml文件寫入操作實例

    java使用Jdom實現(xiàn)xml文件寫入操作實例

    這篇文章主要介紹了java使用Jdom實現(xiàn)xml文件寫入操作的方法,以完整實例形式分析了Jdom針對XML文件寫入操作的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-10-10
  • 使用RestTemplate訪問https實現(xiàn)SSL請求操作

    使用RestTemplate訪問https實現(xiàn)SSL請求操作

    這篇文章主要介紹了使用RestTemplate訪問https實現(xiàn)SSL請求操作,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
    2021-10-10
  • JVM內(nèi)存區(qū)域劃分相關原理詳解

    JVM內(nèi)存區(qū)域劃分相關原理詳解

    這篇文章主要介紹了JVM內(nèi)存區(qū)域劃分相關原理詳解,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2020-10-10
  • Springmvc數(shù)據(jù)格式化原理及代碼案例

    Springmvc數(shù)據(jù)格式化原理及代碼案例

    這篇文章主要介紹了Springmvc數(shù)據(jù)格式化原理及代碼案例,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2020-10-10
  • 一文搞懂Java中的線程安全與線程同步

    一文搞懂Java中的線程安全與線程同步

    線程安全指在被多個線程訪問時,程序可以持續(xù)進行正確的處理。線程同步是指程序中用于控制不同線程間操作發(fā)生相對順序的機制。本文將通過示例詳細為大家講講二者的使用,需要的可以參考一下
    2022-06-06
  • MyBatis深入分析數(shù)據(jù)庫交互與關系映射

    MyBatis深入分析數(shù)據(jù)庫交互與關系映射

    這篇文章主要介紹了MyBatis中的數(shù)據(jù)庫交互與關系映射,MyBatis是一款優(yōu)秀的持久層框架,它支持定制化SQL、存儲過程以及高級映射,MyBatis避免了幾乎所有的JDBC代碼和手動設置參數(shù)以及獲取結(jié)果集,需要的朋友可以參考下
    2024-05-05
  • Spring Boot RestTemplate提交表單數(shù)據(jù)的三種方法

    Spring Boot RestTemplate提交表單數(shù)據(jù)的三種方法

    本篇文章主要介紹了Spring Boot RestTemplate提交表單數(shù)據(jù)的三種方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-03-03
  • 深入理解JAVA 備忘錄模式

    深入理解JAVA 備忘錄模式

    這篇文章主要介紹了JAVA 備忘錄模式的的相關資料,文中示例代碼非常細致,供大家參考和學習,感興趣的朋友可以了解下
    2020-06-06
  • spring@value注入配置文件值失敗的原因分析

    spring@value注入配置文件值失敗的原因分析

    這篇文章主要介紹了spring@value注入配置文件值失敗的原因分析,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
    2021-12-12

最新評論

固阳县| 容城县| 安徽省| 佛学| 洮南市| 邢台县| 永吉县| 垦利县| 于田县| 武冈市| 礼泉县| 都匀市| 巴青县| 永新县| 新建县| 庄浪县| 吉林市| 淳安县| 武穴市| 尼玛县| 广宁县| 甘谷县| 高碑店市| 慈溪市| 海林市| 乐东| 五大连池市| 鄂托克旗| 杨浦区| 镇安县| 宁城县| 谢通门县| 新竹县| 武乡县| 常德市| 定陶县| 登封市| 咸阳市| 繁峙县| 榆树市| 横峰县|