[CHR-7] Added hide on header scroll

app/src/plugins/tm@dashboard/tasks/tasks.vue

@@ -1,19 +1,22 @@
 <template>
 	<div ref="page">
-		<A-task-filter v-if="$store.getters['tm/isInitialized']" :split-days="timelineData ? splitDays : null" @filter-changed="onFilterChanged" :style="{marginTop: headerMarginTop}" ref="filter" />
+		<A-task-filter v-if="$store.getters['tm/isInitialized']" :split-days="timelineData ? splitDays : null" @filter-changed="onFilterChanged" ref="filter" />
 		<Z-timeline v-if="timelineData" :calData="timelineData" :calConfig="config" :splits="splitDays" />
 	</div>
 </template>
 
 <script>
-import ATaskFilter 								from './_components/a-tasks-filter.vue'
-import ZTimeline 								from '@/plugins/tm@dashboard/_components/z-timeline.vue'
-import { addDays, subDays } 					from 'date-fns'
-import moment 									from 'moment'
-import timelineUtils 							from './_utils/timeline.utils'
-import { mapGetters } 							from 'vuex'
+import ATaskFilter 				from './_components/a-tasks-filter.vue'
+import ZTimeline 				from '@/plugins/tm@dashboard/_components/z-timeline.vue'
+import { addDays, subDays } 	from 'date-fns'
+import moment 					from 'moment'
+import timelineUtils 			from './_utils/timeline.utils'
+import { mapGetters } 			from 'vuex'
+import FilterMixin				from '../_mixins/Filter.mixin'
 
 export default {
+	mixins: [FilterMixin],
+
 	components: {
 		ATaskFilter,
 		ZTimeline
@@ -23,8 +26,6 @@ export default {
 		return {
 			filter: null,
 			subtasks: null,
-			headerMarginTop: '0px',
-			previousScrollTop: 0,
 			config: {
 				date: subDays(new Date(), 1),
 				scrollHour: 7,
@@ -147,11 +148,6 @@ export default {
 		this.$events.on('on-blocker-deleted', () => {
 			this.onFilterChanged(this.filter)
 		})
-
-		setTimeout(() => {
-			this.$refs.page?.querySelector('.vuecal__bg')?.addEventListener('scroll', this.handleScroll)
-		}, 1000)
-		// window
 	},
 
 	unmounted() {
@@ -159,8 +155,6 @@ export default {
 		this.$events.off('on-subtask-deleted')
 		this.$events.off('on-blocker-edited')
 		this.$events.off('on-blocker-deleted')
-
-		this.$refs.page?.querySelector('.vuecal__bg')?.removeEventListener('scroll', this.handleScroll)
 	},
 
 	methods: {
@@ -182,17 +176,8 @@ export default {
 			} catch (error) {
 				this.$toast.error('Nepodarilo sa nacitat data!')
 			}
-		},
 
-		handleScroll(e) {
-			if (this.previousScrollTop > e.target.scrollTop)
-				this.headerMarginTop = '0px'
-			else
-				this.headerMarginTop = `-${this.$refs.filter.$el.offsetHeight}px`
-
-			console.log(this.headerMarginTop)
-
-			this.previousScrollTop = e.target.scrollTop
+			this._initScrollListener()
 		}
 	}
 }