前端界面增加分页。

deploy
DESKTOP-4RNDQIC\29019 2020-02-23 22:59:08 +08:00
parent 5d06e40f0e
commit 5dd4579897
4 changed files with 90 additions and 13 deletions

View File

@ -28,5 +28,10 @@ class Doc extends \Core\Controller
$this->JsonResp(200,null,"error");
}
}
public function countAction(){
$docs = new Models\Doc();
$ret = $docs->Count();
$this->JsonResp(200,$ret,"OK");
}
}

View File

@ -68,5 +68,11 @@ class Doc extends Model
$recv = $stmt->fetchAll();
return $recv;
}
public function Count(){
$db = static::getDB();
$stmt = $db->query('select count(*) from doc');
$result = $stmt->fetchAll();
return $result;
}
}

View File

@ -64,14 +64,7 @@
height:auto!important;
min-height:600px;
}
#footer{
bottom: 0px;
background: #eee;
left:35%;
height: 50px;
margin-top: 10px;
}
#container #left{
display: inline-block;
text-align: center;
@ -104,6 +97,9 @@
border: #0a0a0a 1px;
color: -internal-quirk-inherit;
border-collapse:collapse;
}
img{
}
td{
display: table-cell;
@ -122,6 +118,34 @@ tr{
ul li a{
color: white;
}
#page{
bottom: 0px;
background: #eee;
height: 30px;
margin-top: 20px;
text-align: center;
}
#page ul {
padding:0; /* 将默认的内边距去掉 */
margin:auto; /* 将默认的外边距去掉 */
width: 10%;
height: 30px;
margin-bottom: 10px;
overflow: hidden;
}
#page ul li{
list-style:none; /* 将默认的列表符号去掉 */
padding:0; /* 将默认的内边距去掉 */
margin:0; /* 将默认的外边距去掉 */
float: left; /* 往左浮动 */
display: block;
width: 20px;
font-size: 25px;
text-decoration: none;
background: #20375f;
text-align: left;
}
</style>
@ -136,14 +160,17 @@ ul li a{
<li><a href="/wapi/Blog/index" style="font-size: 25px;text-decoration: none; background: #20375f;">文章</a></li>
{% endif %}
<li style="font-size: 25px;">项目</li>
<li style="font-size: 25px;">杂文</li>
<li style="font-size: 25px;text-decoration: none; background: #20375f;">项目</li>
<li style="font-size: 25px;text-decoration: none; background: #20375f;">杂文</li>
<li style="font-size: 25px;text-decoration: none; background: #20375f;">bug总结</li>
{% if debug == true %}
<li><a href="/api/public/Blog/donate" style="font-size: 25px;text-decoration: none; background: #20375f;">赞助</a></li>
{%else%}
<li><a href="/wapi/Blog/donate" style="font-size: 25px;text-decoration: none; background: #20375f;">赞助</a></li>
{% endif %} </ul>
</div>
</div>
<div id="container" >
<div id="left">
@ -193,6 +220,14 @@ ul li a{
style="width: 300px;height: 420px;margin-left: 25%;">
{% endif %}
</div>
<span id="page">
<ul id="page_ul">
<li><a href="/api/public/Blog/index" style="font-size: 25px; text-decoration: none; background: #20375f;text-align: left;">P</a></li>
<li><a href="/api/public/Blog/index" style="font-size: 25px; text-decoration: none; background: #20375f;text-align: left;">1</a></li>
<li><a href="/api/public/Blog/index" style="font-size: 25px; text-decoration: none; background: #20375f;text-align: left;">2</a></li>
<li><a href="/api/public/Blog/index" style="font-size: 25px; text-decoration: none; background: #20375f; text-align: left;">N</a></li>
</ul>
</span>
<div id="footer">
<p style="font-size: 5px;margin: auto;width: 250px;text-align: center">个人网站,备案号: 闽ICP备19002644号-1</p>
<p style="font-size: 5px;margin: auto;width: 150px;text-align: center">testingcloud.club</p>

View File

@ -1,4 +1,5 @@
var baseUrl = 'http://127.0.0.1/api/public/';
var count = 0;
function updateMenu(){
//初始化
$('.subMenu').hide();
@ -42,11 +43,25 @@ $(document).ready(
if(domain === '127.0.0.1'){
console.log("debug mode");
}else{
console.log(baseUrl)
baseUrl = "https://www.testingcloud.club/wapi/";
}
$.ajax({
method: "POST",
url: baseUrl + "Doc/count",
async: false,
dataType: "json",
beforeSend: function (xhr) {
//xhr.setRequestHeader("x-requested-with","DESKTOP_WEB");
},
success: function (data) {
count = data['data']['0'];
console.log(data['data']['0']);
}
});
htmlobj = $.ajax({
method: "POST",
url: "https://www.testingcloud.club/wapi/Doc/docType",
url: baseUrl + "Doc/docType",
async: false,
dataType: "json",
beforeSend: function (xhr) {
@ -79,17 +94,16 @@ $(document).ready(
Object.keys(objs).forEach(function (doc_id) {
let rand = parseInt(Math.random() * 10000 %10000);
$("#type_id_" + key).append('<li><a ' + 'id=' + rand + '>'+ objs[doc_id].title + '</a></li>');
console.log(doc_id,objs[doc_id].title);
//console.log(doc_id,objs[doc_id].title);
// 注册回调s
// console.log("#type_id_0 li a #" + rand);
$("#" + rand).on("click",(function () {
console.log($("#" + rand).html());
//console.log($("#" + rand).html());
$(location).attr('href', baseUrl + "Blog/article?title=" + $("#" + rand).html() + "&type=" + key);
}));
})
}
console.log("加载完毕");
}
}
);
@ -105,3 +119,20 @@ $(document).ready(
$("#right").style.overflow = "scroll";
}
);
document.onreadystatechange = () => {
if (document.readyState === 'complete') {
var url = window.location.href;
console.log(url.indexOf('index'));
//$("#page").style.display = "none";
if(url.indexOf('index') < 0 ){
$("#page").hide()
}
console.log(count[0]);
pages = count[0]/5;
console.log(Math.ceil(pages))
for(i = 0;i < pages;i++){
$("#page_ul").append('<li><a>'+ i + '</a></li>')
}
}
};