-
-
Notifications
You must be signed in to change notification settings - Fork 2.3k
/
dashboards.js
130 lines (104 loc) · 3.43 KB
/
dashboards.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
/**
* First we will load all of this project's JavaScript dependencies which
* includes Vue and other libraries. It is a great starting point when
* building robust, powerful web applications using Vue and Laravel.
*/
require('./../../bootstrap');
import Vue from 'vue';
import DashboardPlugin from './../../plugins/dashboard-plugin';
import Global from './../../mixins/global';
import Form from './../../plugins/form';
import BulkAction from './../../plugins/bulk-action';
import {getQueryVariable} from './../../plugins/functions';
import AkauntingWidget from './../../components/AkauntingWidget';
import {DatePicker, Tooltip} from 'element-ui';
Vue.use(DatePicker, Tooltip);
// plugin setup
Vue.use(DashboardPlugin);
const dashboard = new Vue({
el: '#main-body',
components: {
[DatePicker.name]: DatePicker,
[Tooltip.name]: Tooltip,
AkauntingWidget
},
mixins: [
Global
],
data: function () {
return {
widget_modal: false,
widgets: {},
widget: {
id: 0,
name: '',
class: '',
width: '',
action: 'create',
sort: 0,
},
filter_date: [],
form: new Form('dashboard'),
bulk_action: new BulkAction('dashboards')
};
},
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);
}
this.getWidgets();
},
methods:{
// Get All Widgets
getWidgets() {
var self = this;
axios.get(url + '/common/widgets')
.then(function (response) {
self.widgets = response.data;
})
.catch(function (error) {
});
},
// Add new widget on dashboard
onCreateWidget() {
this.widget_modal = true;
},
// Edit Dashboard selected widget setting.
onEditWidget(widget_id) {
var self = this;
axios.get(url + '/common/widgets/' + widget_id + '/edit')
.then(function (response) {
self.widget.id = widget_id;
self.widget.name = response.data.name;
self.widget.class = response.data.class;
self.widget.width = (response.data.settings.raw_width) ? response.data.settings.raw_width : response.data.settings.width;
self.widget.action = 'edit';
self.widget.sort = response.data.sort;
self.widget_modal = true;
})
.catch(function (error) {
self.widget_modal = false;
});
},
onCancel() {
this.widget_modal = false;
this.widget.id = 0;
this.widget.name = '';
this.widget.class = '';
this.widget.width = '';
this.widget.action = 'create';
this.widget.sort = 0;
},
// Global filter change date column
onChangeFilterDate() {
if (this.filter_date) {
window.location.href = url + '?start_date=' + this.filter_date[0] + '&end_date=' + this.filter_date[1];
} else {
window.location.href = url;
}
},
}
});