홈 탐색 도움말
로그인
david
/
alexis2
1
0
포크 0
파일 이슈 0 풀 리퀘스트 0 위키
소스 검색

pagination

David 10 년 전
부모
87beada0b7
커밋
e16a331863
5개의 변경된 파일과 153개의 추가작업 그리고 3개의 파일을 삭제
분할 보기 변경상태 보기
  1. 5 1
      db.py
  2. 111 0
      front/2index.html
  3. 3 0
      front/index.html
  4. 20 2
      front/js/app.js
  5. 14 0
      front/style.css

+ 5 - 1
db.py
파일 보기 

@@ -45,10 +45,14 @@ class db():
 
         if "keyword" in filter and len(filter["keyword"]) >0:
 
             db_filter["kw"]={"$all": filter["keyword"]}
 
 
+        pageNumber=0
 
+        if "page" in filter:
 
+            pageNumber=filter["page"]
 
         #print(db_filter)
 
         res = self.c_articles.find(db_filter,{"html":0,"text":0})
 
         if res is not None:
 
-            q = res.sort("scrap_date",DESCENDING).limit(limit)
 
+            toSkip=(((pageNumber-1)*limit) if pageNumber > 0 else 0)
 
+            q = res.skip(toSkip).sort("scrap_date",DESCENDING).limit(limit)
 
             count = q.count()
 
         else:
 
             q = []

+ 111 - 0
front/2index.html
파일 보기 

@@ -0,0 +1,111 @@
 
+<!DOCTYPE html>
 
+<html ng-app="app">
 
+	<head>
 
+		<!-- Latest compiled and minified CSS -->
 
+		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
 
+
 
+		<!-- Optional theme -->
 
+		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
 
+		<link rel="stylesheet" href="style.css">
 
+
 
+		<!-- Latest compiled and minified JavaScript -->
 
+		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
 
+		<link rel="stylesheet" type="text/css" href="js/ng-tags-input.min.css">
 
+		<link rel="stylesheet" type="text/css" href="js/ng-tags-input.bootstrap.min.css">
 
+
 
+		<script src="js/angular.min.js"></script>
 
+		<script src="js/ng-tags.js"></script>
 
+		<script src="js/ng-tags-input.min.js"></script>
 
+		<script src="js/app.js"></script>
 
+	</head>
 
+<body>
 
+	<div ng-controller="main">
 
+		<div class="row">
 
+			<div class="col-sm-3 col-md-3 col-lg-3 col-xl-3">
 
+				<div class="row">
 
+					<div class="col-sm-4 col-md-4 col-lg-4">MinDate:</div>
 
+					<input class="form-control col-sm-8 col-md-8 col-lg-8" ng-model="mindate" type="text"/>
 
+				</div>
 
+				<div class="row">
 
+					<div class="col-sm-4 col-md-4 col-lg-4">MaxDate:</div>
 
+					<input class="form-control col-sm-8 col-md-8 col-lg-8" ng-model="maxdate" type="text"/>
 
+				</div>
 
+				<div class="row">
 
+					<div class="col-sm-4 col-md-4 col-lg-4">Site:</div>
 
+					<input class="form-control col-sm-8 col-md-8 col-lg-8" ng-model="site" type="text"/>
 
+				</div>
 
+				<div class="row">
 
+					<div class="col-sm-4 col-md-4 col-lg-4">Keyword:</div>
 
+					<!--
 
+					<input class="col-sm-8 col-md-8 col-lg-8" ng-model="keyword" type="text"/>
 
+					-->
 
+					<tags-input ng-model="selected_kw" add-on-paste="true" add-from-autocomplete-only="true" replace-spaces-with-dashes="false">
 
+						<auto-complete source="filtered($query)"></auto-complete>
 
+					</tags-input>
 
+				</div>
 
+				<div class="row">
 
+					<div class="col-sm-4 col-md-4 col-lg-4">MinWeight:</div>
 
+					<input class="form-control col-sm-8 col-md-8 col-lg-8" ng-model="minweight" type="text"/>
 
+				</div>
 
+				<div class="row">
 
+					<div class="col-md-4"></div>
 
+					<div class="col-md-8">
 
+						<button ng-click="filter()" class="btn btn-default">Filter</button>
 
+					</div>
 
+				</div>
 
+
 
+				<div class="row">
 
+					<div class="col-md-12">
 
+						Parse source:
 
+						<input type="text" ng-model="source" class="form-control" placeholder="url">
 
+						<input type="text" ng-model="sourceName" class="form-control" placeholder="name">
 
+						<input type="text" ng-model="sourceSelector" class="form-control" placeholder="selector">
 
+						<input type="number" ng-model="sourceRSS" class="form-control" value=0>
 
+						<button class="btn btn-default" ng-click="parseSource(source,sourceName,sourceSelector,sourceRSS,0)">Test</button>
 
+						<button class="btn btn-default" ng-click="parseSource(source,sourceName,sourceSelector,sourceRSS,1)">Add</button>
 
+					</div>
 
+				</div>
 
+			</div>
 
+			<div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
 
+				<div class="row" style="border:1px solid black" ng-repeat="n in news">
 
+					<div class="col-md-12">
 
+						<div class="row">
 
+							<div class="col-md-12">
 
+								{{n.title}}
 
+							</div>
 
+						</div>
 
+						<div class="row" style="font-size:11px">
 
+							<div class="col-md-8">
 
+								{{n.scrap_date}}
 
+							</div>
 
+							<div class="col-md-4">
 
+								Weight: {{n.weight}}
 
+							</div>
 
+						</div>
 
+						<!-- source: {{n.source}} -->
 
+						<div class="summary" style="font-size:12px">
 
+							{{n.summary}}
 
+						</div>
 
+						<div class="row">
 
+							<div class="col-md-7">
 
+								<a ng-href="{{n.url}}">Visit site</a>
 
+							</div>
 
+							<div class="col-md-5">
 
+								<a ng-click="getArticle(n)">Read complete article</a>
 
+							</div>
 
+						</div>
 
+
 
+						<div class="row">
 
+							<div class="col-md-12 keywords">
 
+								Keyword(s): {{n.kw.join(", ")}}
 
+							</div>
 
+						</div>
 
+					</div>
 
+				</div>
 
+			</div>
 
+			<div id="news" class="col-sm-5 col-md-5 col-lg-5 col-xl-5" ng-bind-html="newsArticle"></div>
 
+		</div>
 
+	</div>
 
+</body>
 
+</html>
 
+

+ 3 - 0
front/index.html
파일 보기 

@@ -81,6 +81,9 @@
 
 						Keyword(s): {{n.kw.join(", ")}}
 
 					</div>
 
 				</section>
 
+				<div class="pagination">
 
+					 Page: <input type="number" ng-model="curPage" ng-blur="changePage(curPage)"> / {{totPages}}
 
+				</div>
 
 			</div>
 
 			<div class="article-wrapper">
 
 				<div id="news" ng-bind-html="newsArticle"></div>

+ 20 - 2
front/js/app.js
파일 보기 

@@ -3,6 +3,10 @@ app=angular.module('app', ["ngTagsInput"]);
 
 app.controller('main', function($scope,$http,$sce) {
 
 	$scope.news=[];
 
 	$scope.newsArticle="";
 
+	$scope.curPage=1;
 
+	$scope.totPages=1;
 
+	var lastPage=0;
 
+	var itemsPerPage=15;
 
 
 	$scope.keywords=[];
 
 	$scope.selected_kw=[];
 
@@ -32,11 +36,14 @@ app.controller('main', function($scope,$http,$sce) {
 
 			}
 
 		);
 
 	};
 
-	$scope.filter = function() {
 
+	$scope.filter = function(page) {
 
 		var kw = $scope.selected_kw.map(function(e){return e.text});
 
-		$http.post("/pymnts/articles/",{"mindate":$scope.mindate,"maxdate":$scope.maxdate,"site":$scope.site,"keyword":kw,"minweight":$scope.minweight}).then(
 
+		$http.post("/pymnts/articles/",{"mindate":$scope.mindate,"maxdate":$scope.maxdate,"site":$scope.site,"keyword":kw,"minweight":$scope.minweight,"page":page}).then(
 
 			function(data) {
 
+				if(page==undefined)
 
+					$scope.curPage=1;
 
 				$scope.news=data.data.articles;
 
+				$scope.totPages=Math.ceil(data.data.count/itemsPerPage);
 
 			},
 
 			function(data) {
 
 			}
 
@@ -57,4 +64,15 @@ app.controller('main', function($scope,$http,$sce) {
 
 			}
 
 		);
 
 	};
 
+	$scope.changePage = function(newPage) {
 
+		if (newPage > $scope.totPages)
 
+			newPage=$scope.totPages;
 
+		if (newPage < 1)
 
+			newPage=1;
 
+		if (newPage==lastPage)
 
+			return;
 
+		lastPage=newPage;
 
+		$scope.curPage=newPage; //clamp
 
+		$scope.filter(newPage);
 
+	};
 
 });

+ 14 - 0
front/style.css
파일 보기 

@@ -177,6 +177,7 @@ tags-input .tags .tag-item {
 
 	width: 40%;
 
 	float: left;
 
 	padding: 0px;
 
+	margin-bottom:30px;
 
 }
 
 
 .news-wrapper section {
 
@@ -236,3 +237,16 @@ ul.news-meta li {
 
    font-size: 14px;
 
    margin-left: 5px;
 
 }
 
+
 
+.pagination { 
+	height:30px;
 
+	background-color:white;
 
+	width:40%;
 
+	position:fixed;
 
+	bottom:0px;
 
+	margin:0px;
 
+}
 
+
 
+.pagination > input { width: 50px;}
 
+
 
+#news img { max-width:90%; }