Portal dashboard added date filter

resources/assets/js/views/portal/dashboard.js

@@ -12,20 +12,51 @@ import Vue from 'vue';
 import DashboardPlugin from './../../plugins/dashboard-plugin';
 
 import Global from './../../mixins/global';
+import {getQueryVariable} from './../../plugins/functions';
+import {DatePicker, Tooltip} from 'element-ui';
 
-import {Tooltip} from 'element-ui';
+Vue.use(DatePicker, Tooltip);
 
 // plugin setup
-Vue.use(DashboardPlugin, Tooltip);
+Vue.use(DashboardPlugin, DatePicker, Tooltip);
 
 const app = new Vue({
-    el: '#app',
+    el: '#main-body',
 
     components: {
+        [DatePicker.name]: DatePicker,
         [Tooltip.name]: Tooltip,
     },
 
     mixins: [
         Global
     ],
+
+    data: function () {
+        return {
+            filter_date: [],
+        };
+    },
+
+    mounted() {
+        let start_date = getQueryVariable('start_date');
+
+        if (start_date) {
+            let end_date = getQueryVariable('end_date');
+
+            this.filter_date.push(start_date);
+            this.filter_date.push(end_date);
+        }
+    },
+
+    methods: {
+        // Global filter change date column
+        onChangeFilterDate() {
+            if (this.filter_date) {
+                window.location.href = url + '/portal?start_date=' + this.filter_date[0] + '&end_date=' + this.filter_date[1];
+            } else {
+                window.location.href = url + '/portal';
+            }
+        },
+    }
 });