首页静态化模板数据渲染

src/main/java/com/caimei/www/controller/unlimited/HomeController.java

@@ -6,6 +6,7 @@ import com.caimei.www.pojo.JsonModel;
 import com.caimei.www.pojo.page.PageFloor;
 import com.caimei.www.service.page.BaseService;
 import com.caimei.www.service.page.HomeService;
+import lombok.extern.slf4j.Slf4j;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.GetMapping;
@@ -13,6 +14,7 @@ import org.springframework.web.bind.annotation.ResponseBody;
 
 import javax.annotation.Resource;
 import java.util.List;
+import java.util.Map;
 
 /**
  * Description(接口已搬至spi)
@@ -20,6 +22,7 @@ import java.util.List;
  * @author : Charles
  * @date : 2020/6/15
  */
+@Slf4j
 @Controller
 public class HomeController extends BaseController {
 
@@ -42,6 +45,11 @@ public class HomeController extends BaseController {
     public String home(final Model model) {
 		// 获取banner图
 		List<ImageLink> bannerList = baseService.getHomeBanners();
+		// 首页楼层
+		Map<String, Object> floorMap = baseService.getHomeFloors();
+
+		model.addAttribute("floorJson", floorMap);
+        //log.info(floorMap.toString());
 		model.addAttribute("bannerList", bannerList);
         model.addAttribute("msg", "首页");
         return HOME_PATH;
@@ -81,11 +89,11 @@ public class HomeController extends BaseController {
      * 首页楼层专题数据
      * @return
      */
-    @GetMapping("/home/floor")
-    @ResponseBody
-    public JsonModel<List<PageFloor>> getHomePageFloorData() {
-        return homeService.getHomePageFloorData();
-    }
+//    @GetMapping("/home/floor")
+//    @ResponseBody
+//    public JsonModel<List<PageFloor>> getHomePageFloorData() {
+//        return homeService.getHomePageFloorData();
+//    }
 
     /**
      * 首页左侧广告图

src/main/java/com/caimei/www/service/page/BaseService.java

@@ -5,6 +5,7 @@ import com.caimei.www.pojo.page.ImageLink;
 import com.caimei.www.pojo.page.TopMenu;
 
 import java.util.List;
+import java.util.Map;
 
 /**
  * Description
@@ -38,4 +39,9 @@ public interface BaseService {
      * 首页轮播
      */
     List<ImageLink> getHomeBanners();
+
+    /**
+     * 首页楼层
+     */
+    Map<String, Object> getHomeFloors();
 }

src/main/java/com/caimei/www/service/page/HomeService.java

@@ -18,11 +18,11 @@ public interface HomeService {
     /**
      * 首页推荐专区
      */
-    JsonModel<List<ProductList>> getRecommendProducts();
+//    JsonModel<List<ProductList>> getRecommendProducts();
     /**
      * 首页楼层专题数据
      */
-    JsonModel<List<PageFloor>> getHomePageFloorData();
+//    JsonModel<List<PageFloor>> getHomePageFloorData();
     /**
      * 首页左侧广告图
      */

src/main/java/com/caimei/www/service/page/impl/BaseServiceImpl.java

@@ -1,10 +1,12 @@
 package com.caimei.www.service.page.impl;
 
 
+import com.alibaba.fastjson.JSONObject;
 import com.caimei.www.mapper.BaseDao;
 import com.caimei.www.pojo.page.*;
 import com.caimei.www.service.page.BaseService;
 import com.caimei.www.utils.AppletsLinkUtil;
+import com.caimei.www.utils.RequestUtil;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.beans.factory.annotation.Value;
 import org.springframework.cache.annotation.Cacheable;
@@ -14,6 +16,7 @@ import org.thymeleaf.util.StringUtils;
 
 import javax.annotation.Resource;
 import java.util.List;
+import java.util.Map;
 import java.util.stream.Collectors;
 
 /**
@@ -29,6 +32,8 @@ public class BaseServiceImpl implements BaseService {
     private BaseDao baseDao;
     @Value("${caimei.wwwDomain}")
     private String domain;
+	@Value("${caimei.coreServer}")
+	private String coreServer;
     /**
      * 获取搜索热门关键字
      */
@@ -107,4 +112,20 @@ public class BaseServiceImpl implements BaseService {
         return baseDao.getHomeBanners();
     }
 
+    /**
+     * 首页楼层
+     */
+    @Override
+    public Map<String, Object> getHomeFloors() {
+        try {
+            String floorResult = RequestUtil.sendGet(coreServer+"/commodity/home/floor?userId=0&source=1");
+            log.debug(floorResult);
+            Map<String, Object> floorMap = JSONObject.parseObject(floorResult, Map.class);
+            return JSONObject.parseObject(String.valueOf(floorMap.get("data")), Map.class);
+        } catch (Exception e) {
+            log.error("try-catch:",e);
+            return null;
+        }
+    }
+
 }

src/main/java/com/caimei/www/service/page/impl/HomeServiceImpl.java

@@ -33,53 +33,53 @@ public class HomeServiceImpl implements HomeService {
     /**
      * 首页推荐专区商品
      */
-    @Override
-    @Cacheable(value = "getRecommendProducts", key="'www'", unless="#result == null")
-    public JsonModel<List<ProductList>> getRecommendProducts() {
-        List<ProductList> list = homeDao.getRecommendeds();
-        if (list.size() > 0) {
-            // 设置价格等级 及 老图片路径
-            list.forEach(product -> {
-                 product.setPriceGrade(PriceUtil.getpriceGrade(product.getPrice()));
-                 product.setPrice(0d);
-                 product.setImage(ImageUtil.getImageURL("product", product.getImage(), 0, domain));
-            });
-        }
-        return JsonModel.success(list);
-    }
+//    @Override
+//    @Cacheable(value = "getRecommendProducts", key="'www'", unless="#result == null")
+//    public JsonModel<List<ProductList>> getRecommendProducts() {
+//        List<ProductList> list = homeDao.getRecommendeds();
+//        if (list.size() > 0) {
+//            // 设置价格等级 及 老图片路径
+//            list.forEach(product -> {
+//                 product.setPriceGrade(PriceUtil.getpriceGrade(product.getPrice()));
+//                 product.setPrice(0d);
+//                 product.setImage(ImageUtil.getImageURL("product", product.getImage(), 0, domain));
+//            });
+//        }
+//        return JsonModel.success(list);
+//    }
 
     /**
      * 首页楼层专题数据
      */
-    @Override
-    public JsonModel<List<PageFloor>> getHomePageFloorData() {
-        // 大专题:6,小专题:5,商品专题:4,优质供应商:3
-        List<PageFloor> floorList = homeDao.getHomePageFloor();
-        floorList.forEach(floor -> {
-            if(floor.getType() == 6){
-                // 6大专题二级楼层
-                List<PageFloor> bigTopicFloors = homeDao.getHomeBigTopicFloor();
-                bigTopicFloors.forEach(bigTopic -> {
-                    List<ImageLink>  topicData = homeDao.getBigTopicData(bigTopic.getId());
-                    bigTopic.setFloorData(topicData);
-                });
-                floor.setSubFloors(bigTopicFloors);
-            } else if (floor.getType() == 5){
-                // 5小专题
-                List<ImageLink>  topicData5 = homeDao.getSmallTopicData();
-                floor.setFloorData(topicData5);
-            } else if (floor.getType() == 4){
-                // 4商品专题
-                List<ImageLink>  topicData4 = homeDao.getCommodityTopicData();
-                floor.setFloorData(topicData4);
-            } else if (floor.getType() == 3){
-                // 3优质供应商
-                List<ImageLink>  topicData3 = homeDao.getSuppliersTopData();
-                floor.setFloorData(topicData3);
-            }
-        });
-        return JsonModel.success(floorList);
-    }
+//    @Override
+//    public JsonModel<List<PageFloor>> getHomePageFloorData() {
+//        // 大专题:6,小专题:5,商品专题:4,优质供应商:3
+//        List<PageFloor> floorList = homeDao.getHomePageFloor();
+//        floorList.forEach(floor -> {
+//            if(floor.getType() == 6){
+//                // 6大专题二级楼层
+//                List<PageFloor> bigTopicFloors = homeDao.getHomeBigTopicFloor();
+//                bigTopicFloors.forEach(bigTopic -> {
+//                    List<ImageLink>  topicData = homeDao.getBigTopicData(bigTopic.getId());
+//                    bigTopic.setFloorData(topicData);
+//                });
+//                floor.setSubFloors(bigTopicFloors);
+//            } else if (floor.getType() == 5){
+//                // 5小专题
+//                List<ImageLink>  topicData5 = homeDao.getSmallTopicData();
+//                floor.setFloorData(topicData5);
+//            } else if (floor.getType() == 4){
+//                // 4商品专题
+//                List<ImageLink>  topicData4 = homeDao.getCommodityTopicData();
+//                floor.setFloorData(topicData4);
+//            } else if (floor.getType() == 3){
+//                // 3优质供应商
+//                List<ImageLink>  topicData3 = homeDao.getSuppliersTopData();
+//                floor.setFloorData(topicData3);
+//            }
+//        });
+//        return JsonModel.success(floorList);
+//    }
 
     /**
      * 首页左侧广告图

src/main/resources/static/css/index/index_new.h5.css

@@ -80,6 +80,9 @@
         float: left;
     }
     .section_page .page_main_price .main_price_show{color:#f94b4b }
+.section_page .page_main_price .main_price_login,.section_page .page_main_price .main_price_show.none{
+        display: none;
+    }
     .section_page .page_main_price .main_price_unde{
         width: 100%;
         height: 6.5vw;
@@ -98,7 +101,22 @@
         height: 4.2vw;
         line-height: 4.2vw;
     }
-    .section_page .page_main_item.ad_01,.section_page .page_main_li.ad_01{
+.section_page .section_page_main.section_6{
+    height: auto;
+}
+.section_page .section_page_main.section_6 .section_page_more{
+    display:none;
+}
+    .section_page .section_page_main.section_3,
+    .section_page .section_page_main.section_4,
+    .section_page .section_page_main.section_5{
+        height: 167vw;
+    }
+    .section_page_main.section_3 .page_main_item.ad_01,
+    .section_page_main.section_4 .page_main_item.ad_01,
+    .section_page_main.section_5 .page_main_item.ad_01,
+    .section_page_main.section_6 .page_main_item.ad_01,
+    .section_page .page_main_li.ad_01{
         width: 93.6vw !important;
         height: 24vw;
     }
@@ -111,6 +129,10 @@
     .section_page .section_page_main.type_03 {
         height: 167vw;
     }
+    .section_page .section_page_more{
+        display:none;
+    }
+    .section_page .section_page_more.show{display:block;}
     .section_page .section_page_more .more{
         width: 20vw;
         height: 6.4vw;

src/main/resources/static/css/index/index_new.pc.css

@@ -82,9 +82,6 @@ li{list-style:none;}
 .section_page .section_page_main.type_03{
     height: 704px;
 }
-.section_page .section_page_main.max{
-    height:auto;
-}
 .section_page  .page_main_item{
     width: 164px;
     height: 268px;
@@ -105,14 +102,45 @@ li{list-style:none;}
     transform:translateY(-5px);
     box-shadow:0 8px 8px rgba(102,102,102,0.05),0 10px 10px rgba(102,102,102,0.05),0 12px 12px rgba(102,102,102,0.05);
 }
-.section_page .page_main_item.ad_01{
+/*.section_page .page_main_item.ad_01{*/
+/*    width: 884px;*/
+/*    height: 120px;*/
+/*}*/
+/*.section_page .page_main_item.ad_02{*/
+/*    width: 524px;*/
+/*}*/
+/*.section_page .page_main_item.ad_03{*/
+/*    width: 344px;*/
+/*}*/
+.section_page .section_page_main.section_6{
+    height: auto;
+}
+.section_page .section_page_main.section_6 .section_page_more{
+    display:none;
+}
+.section_page .section_page_main.section_3,
+.section_page .section_page_main.section_4,
+.section_page .section_page_main.section_5{
+    height: 704px;
+}
+.section_page .section_page_main.max{
+    height:auto;
+}
+.section_page_main.section_3 .page_main_item.ad_01,
+.section_page_main.section_4 .page_main_item.ad_01,
+.section_page_main.section_5 .page_main_item.ad_01,
+.section_page_main.section_6 .page_main_item.ad_01{
     width: 884px;
     height: 120px;
 }
-.section_page .page_main_item.ad_02{
+.section_page_main.section_1 .page_main_item.ad_01,
+.section_page_main.section_2 .page_main_item.ad_01,
+.section_page_main.section_3 .page_main_item.ad_02,
+.section_page_main.section_4 .page_main_item.ad_02{
     width: 524px;
 }
-.section_page .page_main_item.ad_03{
+.section_page_main.section_2 .page_main_item.ad_02,
+.section_page_main.section_4 .page_main_item.ad_03{
     width: 344px;
 }
 .section_page .page_main_item_adv{
@@ -198,6 +226,9 @@ li{list-style:none;}
     color: #999999;
     text-decoration: line-through;
 }
+.section_page .page_main_price .main_price_login,.section_page .page_main_price .main_price_show.none{
+        display: none;
+    }
 .section_page .page_main_price .price_text_tag{
     width: 100%;
     height: 22px;
@@ -259,7 +290,9 @@ li{list-style:none;}
     height: 32px;
     margin-top: 16px;
     float: left;
+    display: none;
 }
+    .section_page .section_page_more.show{display:block;}
 .section_page .section_page_more .more{
     width: 98px;
     height: 32px;

src/main/resources/static/js/index.js

@@ -285,12 +285,83 @@ var homeData = new Vue({
             console.log('当前时间戳',date);
             console.log('计算时间戳',(date-time));
             return (date -time) < 2*60*1000 ? false : true
+        },
+        // 点击查看更多
+        showMoreItem: function(e){
+            var el = e.currentTarget;
+            $(el).parents(".section_page").find(".section_page_main").addClass("max");
+            $(el).parents(".section_page_more").hide();
+        },
+        // 设置页面查看更多按钮显示
+        setReadeMore: function(){
+            $(".section_page_more").each(function(){
+                var id = $(this).attr('data-id')*1;
+                var size = $(this).attr('data-size')*1;
+                var el = $(this);
+                if (isPC) {
+                    if([1,3].indexOf(id) !== -1 && size>7) {
+                        el.addClass("show");
+                    }
+                    if([2,4,7].indexOf(id) !== -1 && size>5) {
+                        el.addClass("show");
+                    }
+                    if(5 === id && size>10) {
+                        el.addClass("show");
+                    }
+                } else {
+                    if([1,3].indexOf(id) !== -1 && size>3) {
+                        el.addClass("show");
+                    }
+                    if([2,4].indexOf(id) !== -1 && size>2) {
+                        el.addClass("show");
+                    }
+                    if(5 === id && size>4) {
+                        el.addClass("show");
+                    }
+                }
+            });
+        },
+        // 设置页面商品价格
+        setPriceShown: function(){
+            var productIds = [];
+            var userId = GLOBAL_USER_ID;
+            var shopId = GLOBAL_SHOP_ID;
+            var userIdentity = GLOBAL_USER_IDENTITY;
+            $(".main_price_text").each(function(){
+                var id = $(this).attr('data-id');
+                if (productIds.indexOf(id) === -1) {
+                    productIds .push(id);
+                }
+            });
+            // 获取商品价格列表
+            $.getJSON(coreServer+"/commodity/price/list",{
+                userId: GLOBAL_USER_ID,
+                productIds: productIds.join(',')
+            }).done(function (res) {
+                if (res.code === 0 && res.data) {
+                    var priceList = res.data;
+                    $(".main_price_none").hide();
+                    $(".main_price_login").show();
+                    priceList.map(function(price){
+                        // 用户身份 0、个人 1、协销 2、会员机构 3、供应商 4,普通机构
+                        var clubFlag = (userIdentity===2 || userIdentity===4);
+                        var shopFlag = (userIdentity===3 && shopId === price.shopId*1);
+                        var parent = $(".main_price_text.product_"+ price.productId);
+                        if (clubFlag || shopFlag) {
+                            parent.find(".price_o_num").text(price.originalPrice);
+                            parent.find(".price_num").text(price.price);
+                            if(price.promotions && price.promotions.type*1===1 && price.promotions.mode*1===1){
+                                parent.find(".main_price_show.none").show();
+                            }
+                        }
+                    });
+                }
+            });
         }
     },
     created: function() {
-        var userInfo = localStorage.getItem('userInfo');
-        if(userInfo){
-            this.userId = JSON.parse(userInfo).userId;
+        if(GLOBAL_TOKEN){
+            this.userId = GLOBAL_USER_ID;
         }
         this.SwiperBanner();
         // this.GetNavigationMenu();
@@ -298,7 +369,12 @@ var homeData = new Vue({
     },
     mounted: function() {
         var _this = this;
-
+        // 设置页面查看更多
+        this.setReadeMore();
+        if (GLOBAL_USER_ID) {
+            // 获取设置商品价格
+            this.setPriceShown();
+        }
         // this.getAdvertising();
         // 侧边栏滚动判断
         var distance = 0;

src/main/resources/templates/components/footer.html

@@ -13,7 +13,7 @@
             <div class="list" th:each="type: ${helpPages}">
                 <span class="tab" th:text="${type.name}"></span>
                 <div class="con">
-                    <a th:each="page: ${type.linkList}" th:href="'/help/'+${page.id}+'.html'" th:text="${page.name}"></a>
+                    <a th:each="page: ${type.linkList}" th:href="'/help/'+${page.id}+'.html'" th:text="${page.name}" rel="nofollow"></a>
                 </div>
             </div>
             <div class="list">

src/main/resources/templates/index.html

@@ -4,6 +4,7 @@
 <head>
     <title>采美365网--医疗美容生活美容正品采购平台</title>
     <meta name="baidu-site-verification" content="KbkRJg9357"/>
+    <link rel="canonical" href="https://www.caimei365.com/"/>
     <template th:replace="components/head-link"></template>
     <link th:href="@{/css/index/index_new.h5.css(v=${version})}" media="screen and (max-width:768px)" rel="stylesheet" type="text/css">
     <link th:href="@{/css/index/index_new.pc.css(v=${version})}" media="screen and (min-width:768px)" rel="stylesheet" type="text/css">
@@ -14,12 +15,12 @@
 <!-- 首页 -->
 <div id="container">
     <!-- 首页楼层静态数据 -->
-    <input type="hidden" th:value="${floorJson}" id="floorJson">
+    <!--<input type="hidden" th:value="${floorJson}" id="floorJson">-->
     <!--loading-->
     <div v-if="listLoading" class="loading home">
         <img src="/img/base/loading.gif">
     </div>
-    <template>
+    <div>
         <!--首页图片轮播-->
         <div id="swiper-container" class="swiper-container">
             <ul class="swiper-wrapper swiper-wrapper-banner">
@@ -101,6 +102,107 @@
                     </div>
                 </div>
                 <div class="section_left ">
+                    <div class="section_page" th:each="floor,stat : ${floorJson.get('homePageFloor')}">
+                        <template th:if="${floor.get('floorContent')}!=null">
+                            <div class="section_page_title">
+                                <h1 th:text="${floor.get('title')}" th:attr="data-id=${stat.index+1}"></h1>
+                                <p th:text="${floor.get('detail')}"></p>
+                            </div>
+                            <template th:object="${floor.get('floorContent')}">
+<!--                                <div th:class="*{templateType}==8? 'hotList swiper-container-floor' : ''" th:id="*{templateType}==8? 'recommendBox' : ''">-->
+<!--                                    1111-->
+<!--                                </div>-->
+                                <div class="section_page_main clear mfw"  th:attr="class=*{'section_page_main clear mfw section_'+templateType}">
+                                    <!-- 广告图 -->
+                                    <template th:if="*{templateType}==1 or *{templateType}==2 or *{templateType}==3 or *{templateType}==4 or *{templateType}==5">
+                                        <a th:href="*{adsLink1}" class="page_main_item ad_01" target="_blank">
+                                            <img v-if="isPC" th:src="*{pcAdsImage1}" alt="" class="page_main_item_adv">
+                                            <img v-else th:src="*{appletsAdsImage1}" alt="" class="page_main_item_adv">
+                                        </a>
+                                    </template>
+                                    <template th:if="*{templateType}==2 or *{templateType}==3 or *{templateType}==4">
+                                        <a th:href="*{adsLink2}" class="page_main_item ad_02" target="_blank">
+                                            <img v-if="isPC" th:src="*{pcAdsImage2}" alt="" class="page_main_item_adv">
+                                            <img v-else th:src="*{appletsAdsImage2}" alt="" class="page_main_item_adv">
+                                        </a>
+                                    </template>
+                                    <template th:if="*{templateType}==4">
+                                        <a th:href="*{adsLink3}" class="page_main_item ad_03" target="_blank">
+                                            <img v-if="isPC" th:src="*{pcAdsImage3}" alt="" class="page_main_item_adv">
+                                            <img v-else th:src="*{appletsAdsImage3}" alt="" class="page_main_item_adv">
+                                        </a>
+                                    </template>
+                                    <!-- 商品/图片 列表 -->
+                                    <template th:each="pros : ${floor.get('floorImageList')}"  th:object="${pros}">
+                                        <a th:href="*{link}" class="page_main_item ad_04" target="_blank">
+                                            <img class="page_main_image" src="/img/base/placeholder.png" th:attr="data-original=*{image}" th:alt="*{name}">
+                                            <div class="page_main_tag" th:if="*{listType}==2"><p th:text="*{label}"></p></div>
+                                            <div class="page_main_text">
+                                                <template th:if="${pros.get('product')}!=null" th:object="${pros.get('product')}"><span class="tag" th:if="*{beautyActFlag}==1">美博会</span></template>
+                                                <span th:text="${pros.get('name')}"></span>
+                                            </div>
+                                            <div class="page_main_price" th:if="*{listType}==1">
+                                                <template th:if="${pros.get('product')}!=null" th:object="${pros.get('product')}">
+                                                    <!-- 商品价格 -->
+                                                    <div th:attr="class=*{'main_price_text product_'+productId}, data-id=*{productId}">
+                                                        <!-- 正常商品 -->
+                                                        <template th:if="*{productCategory}==1">
+                                                            <div class="price_text_tag" th:if="${pros.get('product').getString('actStatus')}">
+                                                                <p class="listTag" th:if="*{actStatus}==1 and *{promotions}!=null">
+                                                                    <template th:text="*{promotions.name}"></template>
+                                                                    <template th:if="*{promotions.type}==1 and *{promotions.mode}==1">
+                                                                        <!--单品优惠:优惠价-->
+                                                                        <span class="price_num"></span>
+                                                                    </template>
+                                                                </p>
+                                                            </div>
+                                                            <div class="main_price_none">
+                                                                <em class="price_grade"><span class="bold">￥</span><i th:attr="class=*{'icon mIcon price_grade_'+priceGrade}"></i></em>
+                                                            </div>
+                                                            <div class="main_price_login">
+                                                                <!--0公开价格 1不公开价格 2仅对会员机构公开-->
+                                                                <em th:if="*{priceFlag}==1" class="price_grade"><span>￥</span>价格未公开</em>
+                                                                <em th:if="*{priceFlag}==2" class="price_grade"><span>￥</span>会员可见</em>
+                                                                <template th:if="*{priceFlag}!=1 and *{priceFlag}!=2">
+                                                                    <!--机构价-->
+                                                                    <div class="main_price_show">￥<span class="price_num"></span></div>
+                                                                    <!--单品优惠时的划线价-->
+                                                                    <div class="main_price_show none">￥<span class="price_o_num"></span></div>
+                                                                </template>
+                                                            </div>
+                                                        </template>
+                                                        <!-- 二手商品 -->
+                                                        <template th:if="*{productCategory}!=1">
+                                                            <div class="main_price_none sec">
+                                                                <em class="price_grade"><span>￥</span>登录可见</em>
+                                                            </div>
+                                                            <div class="main_price_login">
+                                                                <div class="price_text_tag"></div>
+                                                                <div th:if="*{detailTalkFlag}==2" class="main_price_show">￥价格祥聊</div>
+                                                                <div th:if="*{detailTalkFlag}!=2" class="main_price_show">￥<span class="price_num"></span></div>
+                                                            </div>
+                                                        </template>
+                                                    </div>
+                                                </template>
+                                            </div>
+                                        </a>
+                                    </template>
+                                    <!-- 广告图 -->
+                                    <template th:if="*{templateType}==6">
+                                        <a th:href="*{adsLink1}" class="page_main_item ad_01" target="_blank">
+                                            <img v-if="isPC" th:src="*{pcAdsImage1}" alt="" class="page_main_item_adv">
+                                            <img v-else th:src="*{appletsAdsImage1}" alt="" class="page_main_item_adv">
+                                        </a>
+                                    </template>
+                                </div>
+                                <div class="section_page_more" th:attr="data-id=*{templateType}, data-size=${floor.get('floorImageList').size}">
+                                    <div class="more" @click="showMoreItem($event)"> <i class="icon mIcon"></i>查看更多</div>
+                                </div>
+                            </template>
+                        </template>
+                    </div>
+
+
                     <div class="section_page" v-for="(page,index) in pageList">
                         <div class="section_page_title" v-if="page.floorContent">
                             <h1 v-text="page.title" :data-id="index+1"></h1>