<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="UTF-8">
|
<title>NEWS</title>
|
<style>
|
/** {*/
|
/* padding: 0;*/
|
/* margin: 0;*/
|
/*}*/
|
.container {
|
height: 100%;
|
width: 100%;
|
}
|
/*=============== SCROLL UP ===============*/
|
.scrollup {
|
text-decoration: none;
|
text-align: center;
|
width: 25px;
|
height: 18px;
|
position: fixed;
|
right: 1rem;
|
bottom: -55%;
|
background-color: rgb(108,167,168);
|
box-shadow: 0 8px 12px hsla(228, 66%, 45%, .1);
|
display: inline-flex;
|
padding: .35rem;
|
border-radius: .25rem;
|
color: #ffffff;
|
z-index: 10;
|
transition: .3s;
|
font-size: 8px;
|
}
|
.scrollup:hover {
|
transform: translateY(-.25rem);
|
}
|
/* Show Scroll Up*/
|
.show-scroll {
|
bottom: 5%;
|
}
|
|
.news-desc {
|
font-size: 14px;
|
}
|
.level-1 {
|
color: #333333;
|
}
|
.level-2 {
|
color: #0087ec;
|
}
|
.level-3 {
|
color: red;
|
}
|
</style>
|
</head>
|
<body>
|
<div class="container">
|
|
</div>
|
<a class="scrollup" id="scroll-up">
|
<span>顶部</span>
|
</a>
|
</body>
|
<script src="../static/js/jquery/jquery-3.3.1.min.js"></script>
|
<script src="../static/js/handlebars/handlebars-v4.5.3.js"></script>
|
<script src="../static/js/common.js"></script>
|
<script>
|
var autoScroll = true;
|
|
function scrollUp(){
|
const scrollUp = document.getElementById('scroll-up');
|
if(this.scrollY >= 100) scrollUp.classList.add('show-scroll'); else scrollUp.classList.remove('show-scroll')
|
}
|
window.addEventListener('scroll', scrollUp)
|
|
$(document).on('click ','#scroll-up', function () {
|
window.scrollTo(0, 0);
|
autoScroll = false;
|
})
|
|
$(document).on('click ','body', function () {
|
autoScroll = false;
|
})
|
|
setInterval(()=>{
|
$.ajax({
|
url: baseUrl + "/news/print",
|
// headers: {'token': localStorage.getItem('token')},
|
method: 'GET',
|
success: function (res) {
|
if (res.code === 200) {
|
let template = Handlebars.compile($('#newsTpl').html());
|
$('.container').html(template({list: res.data}));
|
if (autoScroll) {
|
window.scrollTo(0, document.body.scrollHeight)
|
}
|
} else if (res.code === 403) {
|
window.location.href = baseUrl + "/login";
|
} else {
|
console.error(res.msg);
|
}
|
}
|
})
|
}, 1000)
|
|
</script>
|
<script type="text/template" id="newsTpl">
|
{{#each list}}
|
<div class="news-desc level-{{l}}">
|
<span>{{t}}</span> - <span>{{v}}</span>
|
</div>
|
{{/each}}
|
</script>
|
</html>
|
