Commit 41a5ea69 by 侯昆

百科页修改

1 parent bcfb968d
...@@ -69,14 +69,14 @@ ...@@ -69,14 +69,14 @@
</ul> </ul>
<div class="tab-content pt-3"> <div class="tab-content pt-3">
<c:if test="${vo.body.size() > 0}"> <c:if test="${vo.body.size() > 0}">
<div class="tab-pane fade show active" id="content-detail-tab-0" role="tabpanel"> <div class="tab-pane show active" id="content-detail-tab-0" role="tabpanel">
<c:forEach items="${vo.body}" var="item"> <c:forEach items="${vo.body}" var="item">
<p>${item}</p> <p>${item}</p>
</c:forEach> </c:forEach>
</div> </div>
</c:if> </c:if>
<c:if test="${vo.videos.size() > 0}"> <c:if test="${vo.videos.size() > 0}">
<div class="tab-pane fade" id="content-detail-tab-1" role="tabpanel"> <div class="tab-pane" id="content-detail-tab-1" role="tabpanel">
<c:forEach items="<%=Lists.partition(vo.getVideos(), 4)%>" var="group"> <c:forEach items="<%=Lists.partition(vo.getVideos(), 4)%>" var="group">
<div class="row list-img"> <div class="row list-img">
<c:forEach items="${group}" var="item"> <c:forEach items="${group}" var="item">
......
<%@ page import="com.dookay.cihai.app.helper.HtmlHelper" %> <%@ page import="com.dookay.cihai.app.helper.HtmlHelper" %>
<%@ page import="com.google.common.collect.Lists" %> <%@ page import="com.google.common.collect.Lists" %>
<%@ page import="com.alibaba.fastjson.JSON" %>
<%@ include file="/WEB-INF/jsp/include/taglib.jsp" %> <%@ include file="/WEB-INF/jsp/include/taglib.jsp" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %>
...@@ -73,7 +72,7 @@ ...@@ -73,7 +72,7 @@
</ul> </ul>
<div class="tab-content pt-3"> <div class="tab-content pt-3">
<c:if test="${vo.body.size() > 0}"> <c:if test="${vo.body.size() > 0}">
<div class="tab-pane fade show active" id="content-detail-tab-0" role="tabpanel"> <div class="tab-pane show active" id="content-detail-tab-0" role="tabpanel">
<c:forEach items="${vo.body}" var="item"> <c:forEach items="${vo.body}" var="item">
<p>${item}</p> <p>${item}</p>
</c:forEach> </c:forEach>
...@@ -138,7 +137,8 @@ ...@@ -138,7 +137,8 @@
<div class="media"> <div class="media">
<img class="align-self-start mr-3" src="/static/temp/luxun-furen.jpg"> <img class="align-self-start mr-3" src="/static/temp/luxun-furen.jpg">
<div class="media-body"> <div class="media-body">
<p>浙江绍兴人,字松寿,又字乔峰。鲁迅胞弟。1920年在北京大学攻读哲学,次年任上海商务印书馆编辑,从事生物学的研究和编译工作。先后在上海大学、神州大学、上海暨南大学、安徽大学任教。1932年参与筹建中国民权保障同盟。后在上海组织马列主义读书会,开展抗日救亡斗争。抗战胜利后,任生活书店、新知书店编辑。1945年12月与马叙伦等在上海发起成立中国民主促进会。1948年加入中国共产党。1949年9月出席全国政协第一届全体会议。后任国家出版总署副署长、高等教育部副部长、浙江省人民政府副主席、浙江省省长、全国人大常委会副委员长、全国政协副主席、民进中央主席、民盟中央常委。是中共第九至十一届中央委员。著有《生物进化浅说》,译有达尔文《物种起源》。</p> <p>
浙江绍兴人,字松寿,又字乔峰。鲁迅胞弟。1920年在北京大学攻读哲学,次年任上海商务印书馆编辑,从事生物学的研究和编译工作。先后在上海大学、神州大学、上海暨南大学、安徽大学任教。1932年参与筹建中国民权保障同盟。后在上海组织马列主义读书会,开展抗日救亡斗争。抗战胜利后,任生活书店、新知书店编辑。1945年12月与马叙伦等在上海发起成立中国民主促进会。1948年加入中国共产党。1949年9月出席全国政协第一届全体会议。后任国家出版总署副署长、高等教育部副部长、浙江省人民政府副主席、浙江省省长、全国人大常委会副委员长、全国政协副主席、民进中央主席、民盟中央常委。是中共第九至十一届中央委员。著有《生物进化浅说》,译有达尔文《物种起源》。</p>
</div> </div>
</div> </div>
</li> </li>
...@@ -149,7 +149,8 @@ ...@@ -149,7 +149,8 @@
<div class="media"> <div class="media">
<img class="align-self-start mr-3" src="/static/temp/luxun-furen.jpg"> <img class="align-self-start mr-3" src="/static/temp/luxun-furen.jpg">
<div class="media-body"> <div class="media-body">
<p>中国散文家、翻译家。原名櫆寿,字启明,晚年改名遐寿,浙江绍兴人。青年时代留学日本,与兄周树人(鲁迅)一起翻译介绍外国文学。五四运动时任北京大学等校教授,并从事写作。论文《人的文学》、《美文》,新诗《小河》在新文学运动中均有影响。所作散文,风格冲淡朴讷,从容平和。20世纪30年代和林语堂一起鼓吹“闲适幽默”小品。抗战时期曾任伪华北政务委员会教育总署督办。著有《自己的园地》、《雨天的书》、《谈龙集》、《谈虎集》、《瓜豆集》及《中国新文学的源流》等。新中国成立后主要从事翻译工作,译有《日本狂言选》、《伊索寓言》等;著有《鲁迅的故家》、《鲁迅小说中的人物》、《知堂回想录》等。</p> <p>
中国散文家、翻译家。原名櫆寿,字启明,晚年改名遐寿,浙江绍兴人。青年时代留学日本,与兄周树人(鲁迅)一起翻译介绍外国文学。五四运动时任北京大学等校教授,并从事写作。论文《人的文学》、《美文》,新诗《小河》在新文学运动中均有影响。所作散文,风格冲淡朴讷,从容平和。20世纪30年代和林语堂一起鼓吹“闲适幽默”小品。抗战时期曾任伪华北政务委员会教育总署督办。著有《自己的园地》、《雨天的书》、《谈龙集》、《谈虎集》、《瓜豆集》及《中国新文学的源流》等。新中国成立后主要从事翻译工作,译有《日本狂言选》、《伊索寓言》等;著有《鲁迅的故家》、《鲁迅小说中的人物》、《知堂回想录》等。</p>
</div> </div>
</div> </div>
</li> </li>
...@@ -197,7 +198,7 @@ ...@@ -197,7 +198,7 @@
</c:if> </c:if>
<c:if test="${vo.videos.size() > 0}"> <c:if test="${vo.videos.size() > 0}">
<div class="tab-pane fade" id="content-detail-tab-1" role="tabpanel"> <div class="tab-pane" id="content-detail-tab-1" role="tabpanel">
<c:forEach items="<%=Lists.partition(vo.getVideos(), 4)%>" var="group"> <c:forEach items="<%=Lists.partition(vo.getVideos(), 4)%>" var="group">
<div class="row list-img"> <div class="row list-img">
<c:forEach items="${group}" var="item"> <c:forEach items="${group}" var="item">
...@@ -213,7 +214,7 @@ ...@@ -213,7 +214,7 @@
</c:if> </c:if>
<c:if test="${vo.word eq '心脏'}"> <c:if test="${vo.word eq '心脏'}">
<div class="tab-pane " id="content-detail-tab-3" role="tabpanel"> <div class="tab-pane " id="content-detail-tab-3" role="tabpanel">
<div class="carousel slide" id="carouselExampleControls" data-ride="carousel" data-interval="10000"> <div class="carousel slide" id="carouselExampleControls" data-ride="carousel" data-interval="false">
<div class="carousel-inner"> <div class="carousel-inner">
<div class="atlas-content carousel-item active" id="atlas-0"></div> <div class="atlas-content carousel-item active" id="atlas-0"></div>
<div class="atlas-content carousel-item" id="atlas-1"></div> <div class="atlas-content carousel-item" id="atlas-1"></div>
...@@ -240,7 +241,7 @@ ...@@ -240,7 +241,7 @@
<script src="/static/js/plugins/vis/vis.min.js"></script> <script src="/static/js/plugins/vis/vis.min.js"></script>
<c:if test="${vo.word eq '心脏'}"> <c:if test="${vo.word eq '心脏'}">
<script> <script>
$(function() { $(function () {
// 图谱 // 图谱
var nodeDatas = [{ var nodeDatas = [{
atlasNodes: [{ atlasNodes: [{
...@@ -1055,13 +1056,25 @@ ...@@ -1055,13 +1056,25 @@
}; };
return new vis.Network(container, data, options); return new vis.Network(container, data, options);
} }
var newVis = null,
var $carouse = $('#carouselExampleControls'),
newVis = null,
oldVis = null; oldVis = null;
$('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
if ($(e.target).text() === '图谱') {
newVis = draw(nodeDatas, 0); newVis = draw(nodeDatas, 0);
$('#carouselExampleControls').on('slid.bs.carousel', function(data) { }
}).on('hidden.bs.tab', function (e) {
if ($(e.target).text() === '图谱' && newVis) {
newVis.destroy();
$carouse.carousel(0);
}
});
$carouse.on('slid.bs.carousel', function (data) {
if (oldVis) oldVis.destroy(); if (oldVis) oldVis.destroy();
}) })
.on('slide.bs.carousel', function(data) { .on('slide.bs.carousel', function (data) {
oldVis = newVis; oldVis = newVis;
newVis = draw(nodeDatas, data.to); newVis = draw(nodeDatas, data.to);
}) })
......
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
<article class="content-detail"> <article class="content-detail">
<ul class="nav nav-tabs nav-tabs-main" role="tablist"> <ul class="nav nav-tabs nav-tabs-main" role="tablist">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#content-detail-tab-0" role="tab" data-toggle="tab">释义</a> <a class="nav-link active" href="#content-detail-tab-0" role="tab" data-toggle="tab">释义</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#content-detail-tab-1" role="tab" data-toggle="tab">视频 <a class="nav-link" href="#content-detail-tab-1" role="tab" data-toggle="tab">视频
...@@ -112,11 +112,11 @@ ...@@ -112,11 +112,11 @@
<a class="nav-link" href="#content-detail-tab-2" role="tab" data-toggle="tab">音频</a> <a class="nav-link" href="#content-detail-tab-2" role="tab" data-toggle="tab">音频</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link active" href="#content-detail-tab-3" role="tab" data-toggle="tab">图谱</a> <a class="nav-link" href="#content-detail-tab-3" role="tab" data-toggle="tab">图谱</a>
</li> </li>
</ul> </ul>
<div class="tab-content pt-3"> <div class="tab-content pt-3">
<div class="tab-pane" id="content-detail-tab-0" role="tabpanel"> <div class="tab-pane show active" id="content-detail-tab-0" role="tabpanel">
<p>哺乳纲,长鼻目,象科。陆上现存最大的哺乳动物。肩高2.5~3.0米。皮厚毛少,肢粗如柱。鼻与上唇愈合成圆筒状长鼻,鼻端有指状突起一或两个。上颌门齿大而长,称“象牙”。有两种:亚洲象(Elephas maximus),体较小,额部下凹,鼻端具一指状凸起,耳小,后足四蹄。仅雄象有象牙,分布于南亚、东南亚等地;亦见于中国云南等地,国家一级保护动物。非洲象(Loxodonta africana),体较大,额部凸出,鼻端有两个指状凸起,耳大披肩,后足三蹄。雌雄均有象牙,不易驯服,分布于非洲。</p> <p>哺乳纲,长鼻目,象科。陆上现存最大的哺乳动物。肩高2.5~3.0米。皮厚毛少,肢粗如柱。鼻与上唇愈合成圆筒状长鼻,鼻端有指状突起一或两个。上颌门齿大而长,称“象牙”。有两种:亚洲象(Elephas maximus),体较小,额部下凹,鼻端具一指状凸起,耳小,后足四蹄。仅雄象有象牙,分布于南亚、东南亚等地;亦见于中国云南等地,国家一级保护动物。非洲象(Loxodonta africana),体较大,额部凸出,鼻端有两个指状凸起,耳大披肩,后足三蹄。雌雄均有象牙,不易驯服,分布于非洲。</p>
</div> </div>
<div class="tab-pane" id="content-detail-tab-1" role="tabpanel"> <div class="tab-pane" id="content-detail-tab-1" role="tabpanel">
...@@ -299,8 +299,8 @@ ...@@ -299,8 +299,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="tab-pane show active" id="content-detail-tab-3" role="tabpanel"> <div class="tab-pane" id="content-detail-tab-3" role="tabpanel">
<div class="carousel slide" id="carouselExampleControls" data-ride="carousel" data-interval="10000"> <div class="carousel slide" id="carouselExampleControls" data-ride="carousel" data-interval="false">
<div class="carousel-inner"> <div class="carousel-inner">
<div class="atlas-content carousel-item active" id="atlas-0"></div> <div class="atlas-content carousel-item active" id="atlas-0"></div>
<div class="atlas-content carousel-item" id="atlas-1"></div> <div class="atlas-content carousel-item" id="atlas-1"></div>
...@@ -1150,10 +1150,22 @@ ...@@ -1150,10 +1150,22 @@
}; };
return new vis.Network(container, data, options); return new vis.Network(container, data, options);
} }
var newVis = null,
var $carouse = $('#carouselExampleControls'),
newVis = null,
oldVis = null; oldVis = null;
$('a[data-toggle="tab"]').on('show.bs.tab', function(e) {
if ($(e.target).text() === '图谱') {
newVis = draw(nodeDatas, 0); newVis = draw(nodeDatas, 0);
$('#carouselExampleControls').on('slid.bs.carousel', function(data) { }
}).on('hidden.bs.tab', function(e) {
if ($(e.target).text() === '图谱' && newVis) {
newVis.destroy();
$carouse.carousel(0);
}
});
$carouse.on('slid.bs.carousel', function(data) {
if (oldVis) oldVis.destroy(); if (oldVis) oldVis.destroy();
}) })
.on('slide.bs.carousel', function(data) { .on('slide.bs.carousel', function(data) {
......
This diff could not be displayed because it is too large.
...@@ -14,7 +14,6 @@ ...@@ -14,7 +14,6 @@
<a class="nav-link" href="#">全部</a> <a class="nav-link" href="#">全部</a>
<a class="nav-link" href="#">事件</a> <a class="nav-link" href="#">事件</a>
<a class="nav-link" href="#">人物</a> <a class="nav-link" href="#">人物</a>
<a class="nav-link active" href="#">纪念</a>
</nav> </nav>
<div class="list-history-default"></div> <div class="list-history-default"></div>
</div> </div>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!