文章信息中心2

src/main/java/com/caimei/www/controller/BaseController.java

@@ -66,7 +66,7 @@ public class BaseController {
 		return model;
 	}
 
-	protected String getErrorPath(){
+	protected String errorPath(){
 		return ERROR_PATH;
 	}
 }

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

@@ -81,6 +81,8 @@ public class ArticleController extends BaseController {
         model.addAttribute("article", article);
         model.addAttribute("articleType", typeList);
         model.addAttribute("articleId", id);
+        model.addAttribute("typeId", (article!=null ? article.getTypeId() : 0));
+        model.addAttribute("labelId", 0);
         return ARTICLE_DETAIL_PATH;
     }
 

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

@@ -54,7 +54,7 @@ public class SinglePageController extends BaseController {
     public String topic(final Model model, @RequestParam("type") Integer id) {
         PageContent topicPage = singlePageService.getTopicPageById(id);
         if (topicPage == null){
-            return super.getErrorPath();
+            return super.errorPath();
         }
         model.addAttribute("pageData", topicPage);
         return TOPIC_PATH;
@@ -75,7 +75,7 @@ public class SinglePageController extends BaseController {
     public String freePage(final Model model, Integer id) {
         PageContent freePage = singlePageService.getFreePageById(id);
         if (freePage == null){
-            return super.getErrorPath();
+            return super.errorPath();
         }
         model.addAttribute("pageData", freePage);
         return FREE_PAGE_PATH;
@@ -88,7 +88,7 @@ public class SinglePageController extends BaseController {
     public String livePage(final Model model) {
         PageContent livePage = singlePageService.getLivePageData();
         if (livePage == null){
-            return super.getErrorPath();
+            return super.errorPath();
         }
         model.addAttribute("pageData", livePage);
         return LIVE_PATH;

src/main/resources/static/css/article/article.css

@@ -40,7 +40,7 @@ dl,dd,dt{zoom:1}
 @media screen and (min-width:768px){
 .header .h5-head{display:none;}
 .icon:before{content:'';display:inline-block;background:url(/img/base/icon.png) no-repeat;font-size:0}
-.pageWrap{width:100%;text-align:center;margin:20px auto 36px}
+.pageWrap{width:100%;text-align:center;padding:20px 0 36px;}
 .pageWrap a{box-sizing:border-box;display:inline-block;width:40px;height:40px;line-height:40px;border:1px solid #EBECEF;font-size:16px;margin:0 5px;color:#2D3036;background:#fff;border-radius:2px}
 .pageWrap a.on{background:#e15616;color:#fff;border:1px solid #e15616}
 .pageWrap a:hover{color:#E15616}
@@ -78,8 +78,9 @@ dl,dd,dt{zoom:1}
 .bar{width:1190px;margin:0 auto;padding-top:90px;padding-bottom:15px}
 .bar a{color:#777;font-size:14px}
 .classify.biaoqian{border-bottom:solid 1px #ededed}
-.content{width:1190px;margin:0 auto}
-.content .new-list{width:860px;background:#fff;float:left}
+.content{width:1190px;margin:0 auto;position:relative;}
+.content .mainData{float:left;width:860px;}
+.content .new-list{width:100%;background:#fff;}
 .content .row:nth-last-child(1){border-bottom:0}
 .new-list .row{position:relative;display:table;width:800px;height:150px;margin:0 30px;padding:30px 0;border-bottom:solid 1px #ededed}
 .row .new-img{position:absolute;width:210px;height:150px;margin-right:20px}
@@ -103,6 +104,10 @@ dl,dd,dt{zoom:1}
 .xinxi .time:before{width:24px;height:24px;background-position:-117px -329px;vertical-align:top;margin-right:5px}
 .xinxi .hotspot{display:inline-block;}
 .xinxi .hotspot:before{width:24px;height:24px;background-position:-150px -329px;vertical-align:top;margin-right:5px}
+.xinxi .pv{display:inline-block;margin-right:20px}
+.xinxi .pv:before{width:24px;height:24px;background-position:-185px -329px;vertical-align:top;margin-right:5px}
+.xinxi .source{display:inline-block;margin-right:20px}
+.xinxi .source:before{width:24px;height:24px;background-position:-285px -329px;vertical-align:top;margin-right:5px}
 .article .date{margin-right:30px}
 .article .write{margin-left:5px;margin-right:30px}
 .row .new-blurb .introduction{color:#777;font-size:14px;line-height:26px;max-height:52px;overflow :hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
@@ -139,6 +144,67 @@ dl,dd,dt{zoom:1}
 .no-result .nofound span{color:#e15616}
 .no-result .change{font-size:14px;color:#666;margin-top:8px}
 .emliu{display:inline-block;min-width:100px}
+.middle {
+    text-align: center;
+    font-size: 16px;
+    padding: 200px 0;
+}
+.middle img{width:200px;}
+/* article content */
+.content .new-list.article{
+	padding: 24px;
+	margin-bottom: 20px;
+}
+.article .title{
+	line-height: 40px;
+	font-size: 28px;
+	color: #333;
+}
+.article .xinxi{
+	margin-top: 5px;
+	padding-bottom: 14px;
+	border-bottom: solid 1px #ededed;
+}
+.article .new-mian{
+	margin: 23px 0;
+	width: 760px;
+}
+.article .new-mian img{
+	max-width: 100%;
+	display: inline-block;
+	display: block;
+	margin: 0 auto;
+	height: auto !important;
+}
+.article p{
+	font-size: 16px;
+	line-height: 30px;
+	color: #777;
+	margin-bottom: 15px;
+}
+.dianzan{
+	width:auto;
+	text-align: center;
+}
+.article .like{
+	cursor: pointer;
+	display: inline-block;
+	height: 48px;
+	line-height: 48px;
+	margin: 30px auto;
+	border: 1px solid #eee;
+    color: #777;
+    padding: 0 20px;
+    border-radius: 5px;
+    background: #f7f7f7 url(../images/common/zan.jpg) no-repeat 10px;
+    padding-left: 60px;
+}
+.article .like.orange{
+	color:#e15616;
+}
+
+
+
 
 
 
@@ -167,13 +233,14 @@ dl,dd,dt{zoom:1}
 #mHotWord .tag a{display:inline-block;padding:0 2vw;line-height:6vw;font-size:3.7vw;color:#E15616}
 #mHotWord .close{position:absolute;right:3.6vw;top:2.6vw}
 #mHotWord .close:after{content:'\2715';font-size:4.5vw;font-weight:bold}
-.header .type{width:100%;background:#FFF;white-space:nowrap;height:12vw;line-height:12vw;position:relative;overflow-x:auto}
+.header .type{width:100%;background:#FFF;white-space:nowrap;height:12vw;line-height:12vw;position:relative;}
+.header .type>div{width:100%;overflow-x:auto;padding-right:5vw;box-sizing:border-box;}
 .header .type a{display:inline-block;margin-right:1vw;padding:0 2vw;font-size:3.7vw}
 .header .type a.current{color:#e15616}
 .header .type:after{content:'';position:absolute;top:0;right:0;width:6vw;background-image:linear-gradient(to right,rgba(255,255,255,.5),rgba(255,255,255,1));height:100%}
-.bar,.new-list .classify{height:8vw;line-height:8vw;font-size:3.1vw;overflow:hidden;color:#93979F;padding:0 2vw}
-.new-list .classify em{color:#E15616;font-weight:bold;margin-right:1vw;font-size:3.7vw}
-.new-list{min-height:68vh}
+.bar,.classify{height:8vw;line-height:8vw;font-size:3.1vw;overflow:hidden;color:#93979F;padding:0 2vw}
+.classify em{color:#E15616;font-weight:bold;margin-right:1vw;font-size:3.7vw}
+.new-list{min-height:68vh;background:#FFF;}
 .dataRousce{width:100%;background:#FFF;overflow:hidden}
 .dataRousce .row{width:100%;height:34.8vw;border-top:1px solid #F5F5F5;background:#FFF;overflow:hidden;box-sizing:border-box;padding:2vw 3.3vw 2vw 37vw;position:relative;color:#93979F;line-height:3.5vw;font-size:2.6vw}
 .dataRousce .row img{position:absolute;left:3.3vw;top:2.3vw;width:30.4vw;height:30.4vw}
@@ -189,7 +256,12 @@ dl,dd,dt{zoom:1}
 .footer{width:100%;padding:4vw 0;background:#262626;margin-top:4vw;text-align:center}
 .footer .logo img{width:9.2vw;height:8vw;vertical-align:middle}
 .footer .dizhi{display:inline-table;color:#ccc;font-size:3.1vw;line-height:4.8vw;vertical-align:super}
-
+.middle {
+    text-align: center;
+    font-size: 3.7vw;
+    padding: 20vw 0;
+}
+.middle img{width:30vw;}
 
 
 

src/main/resources/static/css/base/base.h5.css

@@ -131,8 +131,8 @@
 #scrollTop .item>span{box-sizing:border-box;display:block;padding:1.5vw;line-height:3.4vw;}
 #scrollTop .item .phone,#scrollTop .item .toTop{width:100%;height:100%;}
 #scrollTop .item .phone:before,#scrollTop .item .toTop:before{display:block;margin:0 auto;width:5.8vw;height:5.8vw;}
-#scrollTop .item .phone:before{background-position:-58.8vw -9vw}
-#scrollTop .item .toTop:before{background-position:-66.8vw -9vw}
+#scrollTop .item .phone:before{background-position:-66.8vw -9vw}
+#scrollTop .item .toTop:before{background-position:-58.8vw -9vw}
 #scrollTop .phoneHover{display:none;background-color:rgba(74,79,88,.7);z-index:999;}
 #scrollTop .phoneHover>div{box-sizing:border-box;width:74.6vw;height:107.3vw;padding-top:32vw;background:url(/img/common/hotline_m.jpg) no-repeat left top;background-size:100% 100%;border-radius:1.6vw;position:relative;top:50%;margin:-60vw auto 0 auto;line-height:9.6vw;font-size:4.2vw}
 #scrollTop .phoneHover i{font-style:normal;color:#FFF}
@@ -142,10 +142,3 @@
 #scrollTop .phoneHover a{color:#E15616}
 #scrollTop .phoneHover a>i{display:inline-block;height:7.2vw;line-height:7.2vw;padding:0 2vw;background:#F55C5C;border-radius:3.6vw;margin-left:4vw;font-size:3.4vw}
 
-/**/
-.mIcon.one{background-image: url(/img/base/baseH5/Grade1.png)}
-    .mIcon.two{background-image: url(/img/base/baseH5/Grade2.png)}
-    .mIcon.three{background-image: url(/img/base/baseH5/Grade3.png)}
-    .mIcon.four{background-image: url(/img/base/baseH5/Grade4.png)}
-    .mIcon.five{background-image: url(/img/base/baseH5/Grade5.png)}
-

src/main/resources/templates/article/components/sidebar.html

@@ -14,8 +14,8 @@
         <p class="classify readerSify">
             推荐阅读
             <span class="nextPreBtn">
-                <span v-if="recommend.nextPage" class="next" @click="getRecommend(params.typeId, recommend.nextPage)"></span>
-                <span v-if="recommend.prePage" class="pre" @click="getRecommend(params.typeId, recommend.prePage)"></span>
+                <span v-if="recommend.nextPage" class="next" @click="getRecommend(typeId, recommend.nextPage)"></span>
+                <span v-if="recommend.prePage" class="pre" @click="getRecommend(typeId, recommend.prePage)"></span>
             </span>
         </p>
         <div class="row" v-for="item in recommend.list">

src/main/resources/templates/article/detail.html

@@ -4,15 +4,15 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, account-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-    <title th:text="${article.title}+'_采美365网'"></title>
+    <title th:text="${article!=null?article.title:''}+'_采美365网'"></title>
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-status-bar-style" content="black">
     <meta http-equiv="pragma" content="no-cache">
     <meta http-equiv="cache-control" content="no-cache">
     <meta http-equiv="expires" content="0">
     <meta http-equiv="X-UA-Compatible" content="IE=Edge">
-    <meta http-equiv="keywords" th:content="${article.keyword}">
-    <meta http-equiv="description" th:content="${article.recommendContent}" >
+    <meta http-equiv="keywords" th:content="${article?.keyword}">
+    <meta http-equiv="description" th:content="${article?.recommendContent}" >
     <meta http-equiv="Cache-Control" content="no-transform " />
     <link rel="shortcut icon" th:href="@{/favicon.png}" type="image/x-icon"/>
     <link rel="bookmark" th:href="@{/favicon.png}" type="image/x-icon"/>
@@ -22,46 +22,51 @@
     <link th:href="@{/css/article/article.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body class="home detailData">
-<input type="hidden" th:value="${article.id}" id="articleId">
+<input type="hidden" th:value="${articleId}" id="articleId">
 <div class="cm-modal"></div>
 <!--导航栏-->
 <template th:replace="article/components/header"></template>
 <!--面包屑-->
-<div v-if="params.typeId" class="bar">
-    <a href="/" target="_blank">首页</a>&gt; <a v-text="typeTxt" href="javascript:void(0);" class="title newTitle"></a>
+<div class="bar">
+    <a href="/" target="_blank">首页</a> &gt; <a  th:each="type: *{articleType}" th:if="${typeId}==${type.id}" th:text="${type.name}" href="javascript:void(0);" class="title newTitle"></a>&gt; 正文
 </div>
 <!--主体内容-->
 <div class="content clearfix" th:object="${article}">
-    <div class="new-list article" th:if="*{not #strings.isEmpty(content)}">
-        <div class="title" th:text="*{title}"></div>
-        <p class="xinxi">
-            <em class="write" th:text="*{publisher}"></em>
-            <em class="date" th:if="*{not #strings.isEmpty(source)}" th:text="*{source}"></em>
-            <em class="time" th:data="*{publishDate}"></em>
-            <span class="P_img">
-                <em class="emliu" th:text="*{pv}"></em>
-            </span>
-        </p>
-        <div class="new-mian" id="contentDiv" th:utext="*{content}"></div>
-        <!--已点赞给类名dianzan加color：#e15616;-->
-        <div class="dianzan">
-            <span class="like " data-count="0" data-th-id="*{id}" th:text="'赞'+*{likes}">
+    <div class="mainData">
+        <div class="new-list article" th:if="${article}!=null">
+            <div class="title" th:text="*{title}"></div>
+            <p class="xinxi">
+                <em class="write icon mIcon" th:text="*{publisher}"></em>
+                <em class="source icon mIcon" th:if="*{not #strings.isEmpty(source)}" th:text="*{source}"></em>
+                <em class="time icon mIcon" th:data="*{publishDate}"></em>
+                <em class="pv icon mIcon" th:text="*{pv}"></em>
+            </p>
+            <div class="new-mian" id="contentDiv" th:utext="*{content}"></div>
+            <!--已点赞给类名dianzan加color：#e15616;-->
+            <div class="dianzan">
+                <span class="like " data-count="0" data-th-id="*{id}" th:text="'赞'+*{likes}">
 
-            </span>
-            <div class="tipbox">
-                <em>
-                    您已经给该信息点过赞!
-                </em>
-                <a href="javascript: void(0);" class="sulf">
-                    确定
-                </a>
+                </span>
+                <div class="tipbox">
+                    <em>
+                        您已经给该信息点过赞!
+                    </em>
+                    <a href="javascript: void(0);" class="sulf">
+                        确定
+                    </a>
+                </div>
             </div>
+            <p class="dea-tag" th:each="label:*{labels}">
+                <span th:if="${not #strings.isEmpty(label)}" th:text="${label}"></span>
+            </p>
         </div>
-        <p class="dea-tag" th:each="label:*{labels}">
-            <span th:if="${not #strings.isEmpty(label)}" th:text="${label}"></span>
-        </p>
-
-
+        <div class="new-list article all_mid" style="min-height:800px" th:if="${article}==null or *{#strings.isEmpty(content)}">
+            <div class="middle">
+                <img src="/img/info/empty.png"/>
+                <p>抱歉,内容已删除</p>
+            </div>
+        </div>
+        <!--相关阅读-->
         <div class="new-list">
             <p class="classify biaoqian">相关阅读</p>
             <div class="row">
@@ -91,13 +96,6 @@
                 </div>
             </div>
         </div>
-
-    </div>
-    <div class="new-list article all_mid" style="min-height: 800px" th:if="*{#strings.isEmpty(content)}">
-        <div class="middle">
-            <img src="/public/3.0/img/myaccount/nn.png"/>
-            <p>抱歉,内容已删除</p>
-        </div>
     </div>
     <!--侧边栏-->
     <template th:replace="article/components/sidebar"></template>

src/main/resources/templates/article/list.html

@@ -27,71 +27,73 @@
 <template th:replace="article/components/header"></template>
 <!--面包屑-->
 <div th:if="${typeId}>0" class="bar">
-    <a href="/" target="_blank">首页</a>&gt; <a  th:each="type: *{articleType}" th:if="${typeId}==${type.id}" th:text="${type.name}" href="javascript:void(0);" class="title newTitle"></a>
+    <a href="/" target="_blank">首页</a>&gt; <a  th:each="type: ${articleType}" th:if="${typeId}==${type.id}" th:text="${type.name}" href="javascript:void(0);" class="title newTitle"></a>
 </div>
 <!--主体内容-->
 <div class="content clearfix">
-    <div class="new-list" id="articleList" v-cloak>
-        <div v-if="params.keyword" class="search">
-            <div class="serachBox" id="topSearch">
-                <input class="keyword" type="text" :value="params.keyword" placeholder="请输入关键词" />
-                <a class="searchBtn" href="javascript:void(0);">搜索</a>
-            </div>
-            <p v-if="isPC" class="result" v-html="'为您找到相关结果<b>'+listRecord+'</b>条'"></p>
-        </div>
-        <p v-else-if="params.labelId" class="classify biaoqian">
-            <em id="labelTxt"></em>相关的文章
-        </p>
-        <p v-if="params.keyword && !isPC" class="classify" v-html="'为您找到相关结果<b>'+listRecord+'</b>条'"></p>
-        <div v-if="listData.length>0" class="dataRousce">
-            <div class="row" v-for="item in listData">
-                <div class="new-img">
-                    <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
-                        <img :src="item.image"/>
-                    </a>
+    <div class="mainData">
+        <div class="new-list" id="articleList" v-cloak>
+            <div v-if="params.keyword" class="search">
+                <div class="serachBox" id="topSearch">
+                    <input class="keyword" type="text" :value="params.keyword" placeholder="请输入关键词" />
+                    <a class="searchBtn" href="javascript:void(0);">搜索</a>
                 </div>
-                <div class="new-blurb">
-                    <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
-                        <p class="title" v-html="item.title"></p>
-                    </a>
-                    <p class="xinxi">
-                        <em v-if="!isPC" class="pv icon mIcon" v-text="item.pv"></em>
-                        <em class="write icon mIcon" v-text="item.publisher"></em>
-                        <em class="time icon mIcon" v-text="item.publishDate.substr(0,10)"></em>
-                        <em v-if="item.labels.length>0&&item.labels[0]" class="hotspot icon mIcon">
-                            <template v-for="(id,i) in item.labelIds">{{i>0?'，':''}}<a v-if="item.labels[i]" v-text="item.labels[i]" :href="'/info/label-' +id+ '-1.html'"></a></template>
-                        </em>
-                    </p>
-                    <p class="introduction" v-html="item.intro"></p>
-                    <p v-if="isPC" class="P_img"><em class="pv icon mIcon" v-text="item.pv"></em></p>
+                <p v-if="isPC" class="result" v-html="'为您找到相关结果<b>'+listRecord+'</b>条'"></p>
+            </div>
+            <p v-else-if="params.labelId" class="classify biaoqian">
+                <em id="labelTxt"></em>相关的文章
+            </p>
+            <p v-if="params.keyword && !isPC" class="classify" v-html="'为您找到相关结果<em>'+listRecord+'</em>条'"></p>
+            <div v-if="listData.length>0" class="dataRousce">
+                <div class="row" v-for="item in listData">
+                    <div class="new-img">
+                        <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
+                            <img :src="item.image"/>
+                        </a>
+                    </div>
+                    <div class="new-blurb">
+                        <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
+                            <p class="title" v-html="item.title"></p>
+                        </a>
+                        <p class="xinxi">
+                            <em v-if="!isPC" class="pv icon mIcon" v-text="item.pv"></em>
+                            <em class="write icon mIcon" v-text="item.publisher"></em>
+                            <em class="time icon mIcon" v-text="item.publishDate.substr(0,10)"></em>
+                            <em v-if="item.labels.length>0&&item.labels[0]" class="hotspot icon mIcon">
+                                <template v-for="(id,i) in item.labelIds">{{i>0?'，':''}}<a v-if="item.labels[i]" v-text="item.labels[i]" :href="'/info/label-' +id+ '-1.html'"></a></template>
+                            </em>
+                        </p>
+                        <p class="introduction" v-html="item.intro"></p>
+                        <p v-if="isPC" class="P_img"><em class="pv icon mIcon" v-text="item.pv"></em></p>
+                    </div>
                 </div>
             </div>
-        </div>
-        <div v-if="listLoading" class="loading">
-            <img src="/img/base/loading.gif">
-        </div>
-        <!-- 如果没有搜索结果。显示此div -->
-        <div v-else-if="listRecord==0" class="no-result">
-            <p><img src="/img/info/kuqi.jpg"></p>
-            <p class="nofound">很抱歉，没有找到 “<span v-text="params.keyword"></span>” 相关结果！</p>
-            <p class="change">请修改或者尝试其他搜索词</p>
-        </div>
-        <!--分页-->
-        <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
-        <div v-if="isPC && pageTotal>1" class="pageWrap clear">
-            <a v-if="params.num>1" class="prev" @click="toPagination(params.num*1-1)" href="javascript:void(0);"></a>
-            <template v-for="n in showPageBtn">
-                <a v-if="n" :class="{'on':(n==params.num)}" @click="toPagination(n)" href="javascript:void(0);" v-text="n"></a>
-                <span v-else>···</span>
-            </template>
-            <a v-if="params.num<pageTotal" class="next" @click="toPagination(params.num*1+1)" href="javascript:void(0);"></a>
-            <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
-            <span>跳至</span>
-            <input v-model="pageInput" @blur="checkNum()"/>
-            <span>页</span>&nbsp;
-            <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
-        </div>
+            <div v-if="listLoading" class="loading">
+                <img src="/img/base/loading.gif">
+            </div>
+            <!-- 如果没有搜索结果。显示此div -->
+            <div v-else-if="listRecord==0" class="no-result">
+                <p><img src="/img/info/kuqi.jpg"></p>
+                <p class="nofound">很抱歉，没有找到 “<span v-text="params.keyword"></span>” 相关结果！</p>
+                <p class="change">请修改或者尝试其他搜索词</p>
+            </div>
+            <!--分页-->
+            <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
+            <div v-if="isPC && pageTotal>1" class="pageWrap clear">
+                <a v-if="params.num>1" class="prev" @click="toPagination(params.num*1-1)" href="javascript:void(0);"></a>
+                <template v-for="n in showPageBtn">
+                    <a v-if="n" :class="{'on':(n==params.num)}" @click="toPagination(n)" href="javascript:void(0);" v-text="n"></a>
+                    <span v-else>···</span>
+                </template>
+                <a v-if="params.num<pageTotal" class="next" @click="toPagination(params.num*1+1)" href="javascript:void(0);"></a>
+                <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
+                <span>跳至</span>
+                <input v-model="pageInput" @blur="checkNum()"/>
+                <span>页</span>&nbsp;
+                <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
+            </div>
 
+        </div>
     </div>
     <!--侧边栏-->
     <template th:replace="article/components/sidebar"></template>