Fix scrollLoad

frontend/src/components/ScrollLoad.vue

@@ -10,28 +10,59 @@
 
 	export default {
 		name: 'ScrollLoad',
-		props: ['loading'],
+		props: ['loading', 'query-selector', 'padding-bottom', 'padding-top'],
 		components: {
 			LoadingButton
 		},
+		computed: {
+			element () {
+				if(this.querySelector){
+					return document.querySelector(this.querySelector);
+				} else {
+					return null;
+				}
+			}
+		},
 		methods: {
 			onScroll: throttle(function (e) {
-				if((window.innerHeight + window.pageYOffset) + 300 >= document.body.scrollHeight) {
-					if(!this.loading) {
-						this.$emit('loadNext')
-					}
-				} else if(document.body.scrollTop <= 150) {
-					if(!this.loading) {
-						this.$emit('loadPrevious')
-					}
+				let paddingBottom = this.paddingBottom || 300;
+				let paddingTop = this.paddingTop || 150;
+				
+				let scrollBottom, scrollTop;
+
+				//If already loading then do not fire
+				if(this.loading) return;
+
+				if(this.element) {
+					scrollBottom = Math.floor(
+						this.element.scrollTop +
+						this.element.getBoundingClientRect().height +
+						paddingBottom -
+						this.element.scrollHeight
+					);
+
+					scrollTop = paddingTop - this.element.scrollTop;
+				} else {
+					scrollBottom =
+						window.innerHeight + window.pageYOffset +
+						paddingBottom -
+						document.body.scrollHeight;
+
+					scrollTop = paddingTop - document.body.scrollTop;
+				}
+
+				if(scrollBottom > 0) {
+					this.$emit('loadNext');
+				} else if(scrollTop > 0) {
+					this.$emit('loadPrevious');
 				}
 			})
 		},
-		created () {
-			window.addEventListener('scroll', this.onScroll)
+		mounted () {
+			(this.element || window).addEventListener('scroll', this.onScroll);
 		},
 		destroyed () {
-			window.removeEventListener('scroll', this.onScroll)
+			(this.element || window).removeEventListener('scroll', this.onScroll);
 		}
 	}
 </script>

frontend/src/components/routes/AdminUsers.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class='admin_users'>
+	<div class='admin_users' ref='scrollElement'>
 		<h1 class='admin_users__header'>Users</h1>
 		<div class='category_widget__box'>
 			<div class='category_widget__text__title'>Filter users</div>
@@ -17,7 +17,13 @@
 				</select-filter>
 			</div>
 		</div>
-		<scroll-load class='category_widget__box' @loadNext='fetchData'>
+		<scroll-load
+			class='category_widget__box'
+			@loadNext='fetchData'
+			:loading='loading'
+			query-selector='.admin_users'
+			:padding-bottom='100'
+		>
 			<table>
 				<tr>
 					<th>