HomeAccounting

1
<template>
2
    <v-app id="inspire">
3
        <v-toolbar dark color="primary">
4
            <!--<v-tooltip bottom>
5
                <v-toolbar-side-icon slot="activator" @click="goToPanel()"></v-toolbar-side-icon>
6
                <span>Выйти в панель</span>
7
            </v-tooltip>!-->
8
            <v-toolbar-title class="white--text">{{ menuTitle }}</v-toolbar-title>
9
            <v-spacer></v-spacer>
10
            <v-tooltip bottom>
11
                <v-btn icon @click="openDynamicAccumulate()" slot="activator">
12
                    <v-icon>show_chart</v-icon>
13
                </v-btn>
14
                <span>Динамика накоплений</span>
15
            </v-tooltip>
16
            <v-tooltip bottom>
17
                <v-btn icon @click="applicationMenu=true" slot="activator">
18
                    <v-icon>apps</v-icon>
19
                </v-btn>
20
                <span>Меню программ</span>
21
            </v-tooltip>
22
            <v-tooltip bottom>
23
                <v-btn icon @click="reload()" slot="activator">
24
                    <v-icon>refresh</v-icon>
25
                </v-btn>
26
                <span>Обновить страницу</span>
27
            </v-tooltip>
28
        </v-toolbar>
29
        <v-alert :type="alertGet.type" dismissible v-model="alertGet.show">
30
            {{ alertGet.message }}
31
        </v-alert>
32
        <v-progress-linear indeterminate :active="ListenPreloader" height="3" color="primary"></v-progress-linear>
33
        <v-menu
34
                transition="slide-x-transition"
35
                bottom
36
                right
37
                :close-on-content-click="false"
38
                :nudge-width="200"
39
                v-model="applicationMenu"
40
        >
41
            <v-card>
42
                <v-list>
43
                    <v-list-tile avatar  @click="fundsControlApplication()">
44
                        <v-list-tile-avatar>
45
                            <v-icon>account_balance</v-icon>
46
                        </v-list-tile-avatar>
47
                        <v-list-tile-content>
48
                            <v-list-tile-title>Транзакции</v-list-tile-title>
49
                            <v-list-tile-sub-title>Управление транзакциями приходов и расходов</v-list-tile-sub-title>
50
                        </v-list-tile-content>
51
                    </v-list-tile>
52
                </v-list>
53
                <v-divider></v-divider>
54
                <v-list>
55
                    <v-list-tile avatar  @click="billsControlApplication()">
56
                        <v-list-tile-avatar>
57
                            <v-icon>account_balance_wallet</v-icon>
58
                        </v-list-tile-avatar>
59
                        <v-list-tile-content>
60
                            <v-list-tile-title>Счета</v-list-tile-title>
61
                            <v-list-tile-sub-title>Управление счетами</v-list-tile-sub-title>
62
                        </v-list-tile-content>
63
                    </v-list-tile>
64
                </v-list>
65
                <v-list>
66
                    <v-list-tile avatar  @click="categoryControlApplication()">
67
                        <v-list-tile-avatar>
68
                            <v-icon>folder</v-icon>
69
                        </v-list-tile-avatar>
70
                        <v-list-tile-content>
71
                            <v-list-tile-title>Категории</v-list-tile-title>
72
                            <v-list-tile-sub-title>Управление категориями транзакций</v-list-tile-sub-title>
73
                        </v-list-tile-content>
74
                    </v-list-tile>
75
                </v-list>
76
                <v-list>
77
                    <v-list-tile avatar  @click="moneyTransactionControlControlApplication()">
78
                        <v-list-tile-avatar>
79
                            <v-icon>compare_arrows</v-icon>
80
                        </v-list-tile-avatar>
81
                        <v-list-tile-content>
82
                            <v-list-tile-title>Перевод средств</v-list-tile-title>
83
                            <v-list-tile-sub-title>Перевод средств между счетами</v-list-tile-sub-title>
84
                        </v-list-tile-content>
85
                    </v-list-tile>
86
                </v-list>
87
                <v-list>
88
                    <v-list-tile avatar  @click="eventsControlApplication()">
89
                        <v-list-tile-avatar>
90
                            <v-icon>notifications</v-icon>
91
                        </v-list-tile-avatar>
92
                        <v-list-tile-content>
93
                            <v-list-tile-title>Управление событиями</v-list-tile-title>
94
                            <v-list-tile-sub-title>Управление напоминаниями бота</v-list-tile-sub-title>
95
                        </v-list-tile-content>
96
                    </v-list-tile>
97
                </v-list>
98
                <v-list>
99
                    <v-list-tile avatar  @click="analyticsApplication()">
100
                        <v-list-tile-avatar>
101
                            <v-icon>show_chart</v-icon>
102
                        </v-list-tile-avatar>
103
                        <v-list-tile-content>
104
                            <v-list-tile-title>Аналитика</v-list-tile-title>
105
                            <v-list-tile-sub-title>Графики</v-list-tile-sub-title>
106
                        </v-list-tile-content>
107
                    </v-list-tile>
108
                </v-list>
109
                <v-list>
110
                    <v-list-tile avatar  @click="barcodeControl()">
111
                        <v-list-tile-avatar>
112
                            <img class="qr-code-icon" src="/image/icons/qrcode.png" />
113
                        </v-list-tile-avatar>
114
                        <v-list-tile-content>
115
                            <v-list-tile-title>Сканировать QR-код</v-list-tile-title>
116
                            <v-list-tile-sub-title>Сканировать код для занесения чека(test)</v-list-tile-sub-title>
117
                        </v-list-tile-content>
118
                    </v-list-tile>
119
                </v-list>
120
                <v-list>
121
                    <v-list-tile avatar  @click="goToSettings()">
122
                        <v-list-tile-avatar>
123
                            <v-icon>settings</v-icon>
124
                        </v-list-tile-avatar>
125
                        <v-list-tile-content>
126
                            <v-list-tile-title>Настройки [beta]</v-list-tile-title>
127
                            <v-list-tile-sub-title>Настройки (общие, интеграции)</v-list-tile-sub-title>
128
                        </v-list-tile-content>
129
                    </v-list-tile>
130
                </v-list>
131
                <v-list>
132
                    <v-list-tile avatar  @click="goToPanel()">
133
                        <v-list-tile-avatar>
134
                            <v-icon>dashboard</v-icon>
135
                        </v-list-tile-avatar>
136
                        <v-list-tile-content>
137
                            <v-list-tile-title>Перейти в панель</v-list-tile-title>
138
                            <v-list-tile-sub-title>Перейти в панель управления</v-list-tile-sub-title>
139
                        </v-list-tile-content>
140
                    </v-list-tile>
141
                </v-list>
142
            </v-card>
143
        </v-menu>
144
        <v-dialog v-model="dynamicAccumulateChart" scrollable max-width="80%">
145
            <v-card>
146
                <v-card-title>
147
                    График динамики накоплений
148
                    <v-spacer></v-spacer>
149
                    <v-btn icon color="primary" flat @click="dynamicAccumulateChart = false">
150
                        <v-icon>close</v-icon>
151
                    </v-btn>
152
                </v-card-title>
153
                <v-divider></v-divider>
154
                <v-card-text>
155
                    <dynamic-accumulate-chart-component ref="dynamicAccumulateChart"></dynamic-accumulate-chart-component>
156
                </v-card-text>
157
                <v-card-actions>
158

159
                </v-card-actions>
160
            </v-card>
161
        </v-dialog>
162

163
        <swipe ref="swipeComponents" :options="swipeOptions">
164
            <swipe-item><bills-control ref="bills"></bills-control></swipe-item>
165
            <swipe-item><funds-control ref="funds"></funds-control></swipe-item>
166
            <swipe-item><category-control ref="categories"></category-control></swipe-item>
167
            <swipe-item><events-control ref="events"></events-control></swipe-item>
168
            <swipe-item><analytics ref="analytics"></analytics></swipe-item>
169
            <!--<swipe-item><barcode-scanner :showBarcodeScanner="barcodeScannerControl" ref="barcode"></barcode-scanner></swipe-item>-->
170
        </swipe>
171
        <money-transaction :showMoneyTransactionComponent="moneyTransactionControl"></money-transaction>
172

173

174
    </v-app>
175
</template>
176
<script>
177
    import BillsControl from "../BillsControl/BillsControl";
178
    import FundsControl from "../FundsControl/FundsControl";
179
    import CategoryControl from "../CategoryControl/CategoryControl";
180
    import MoneyTransaction from "../MoneyTransaction/MoneyTransaction";
181
    import BarcodeScanner from "../BarcodeScanner/BarcodeScanner";
182
    import EventsControl from "../EventsControl/EventsControl";
183
    import Analytics from "../analytics/analytics";
184
    import {Storage, Broker} from '../../classes/QueueBroker/index';
185
    import DynamicAccumulateChartComponent from "../analytics/dynamic-accumulate-chart-component";
186
    import Currency from "../../classes/DB/models/Currency";
187

188
    export default {
189
        name: "private-area",
190

191
        data: () => ({
192
            menuTitle: 'Личный кабинет',
193
            applicationMenu: false,
194

195
            sliderPosition: 0,
196

197
            swipeOptions: {
198
                startSlide: 1,
199
                speed: 300,
200
                auto: 0,
201
                slide: 0,
202
                continuous: true,
203
                disableScroll: false,
204
                stopPropagation: false,
205
                callback: function (index, slide) { this.slide = index },
206
                transitionEnd: function (index, slide) {  }
207
            },
208

209
            //Control Applications
210
            moneyTransactionControl: false, //money-transaction
211
            barcodeScannerControl: false, //barcode-scanner-control
212

213
            reloadBills: false,
214

215
            dynamicAccumulateChart: false,
216

217
        }),
218
        methods: {
219
            openDynamicAccumulate() {
220
                this.dynamicAccumulateChart = true;
221
            },
222
            reload() {
223
                window.location.reload()
224
            },
225
            swiperCallback(index) {
226

227
                switch (index) {
228
                    case 0:
229
                        this.menuTitle = 'Счета';
230
                        this.$refs.bills.getBills();
231
                        break;
232
                    case 1:
233
                        this.menuTitle = 'Транзакции';
234
                        this.$refs.funds.getFunds();
235
                        break;
236
                    case 2:
237
                        this.menuTitle = 'Категории';
238
                        this.$refs.categories.getCategories();
239
                        break;
240
                    case 3:
241
                        this.menuTitle = 'Напоминания';
242
                        this.$refs.events.getEvents();
243
                        break;
244
                    case 4:
245
                        this.menuTitle = "Аналитика";
246
                        break;
247

248
                }
249
            },
250
            billsControlApplication() {
251
                this.menuTitle = 'Счета';
252
                this.$refs.swipeComponents.slide(0);
253
                this.applicationMenu=false;
254
                this.$refs.bills.getBills();
255
            },
256
            fundsControlApplication() {
257
                this.menuTitle = 'Транзакции';
258
                this.$refs.swipeComponents.slide(1);
259
                this.applicationMenu=false;
260
                this.$refs.funds.getFunds();
261
            },
262
            categoryControlApplication() {
263
                this.menuTitle = 'Категории';
264
                this.$refs.swipeComponents.slide(2);
265
                this.applicationMenu=false;
266
                this.$refs.categories.getCategories();
267
            },
268
            eventsControlApplication() {
269
                this.menuTitle = 'Напоминания';
270
                this.$refs.swipeComponents.slide(3);
271
                this.applicationMenu=false;
272
                this.$refs.events.getEvents();
273
            },
274
            analyticsApplication() {
275
                this.menuTitle = 'Аналитика';
276
                this.$refs.swipeComponents.slide(4);
277
                this.applicationMenu=false;
278
            },
279
            barcodeControl() {
280
                window.location.href="/qr-code-scanner";
281
            },
282
            moneyTransactionControlControlApplication() {
283
                this.applicationMenu=false;
284
                this.moneyTransactionControl = true;
285
            },
286
            goToPanel() {
287
              window.location.href = '/home';
288
            },
289
            goToSettings() {
290
                window.location.href = '/settings';
291
            },
292
        },
293
        computed: {
294
            ListenPreloader() {
295
                return this.$store.getters.getPreloader;
296
            },
297
            alertGet () {
298
                return this.$store.getters.getAlert;
299
            },
300
        },
301
        watch: {
302
            sliderPosition() {
303
                let index = this.$refs.swipeComponents.getPos();
304
                this.swiperCallback(this.sliderPosition);
305
            },
306
            swipeOptions: {
307
                handler: function (val, oldVal) {
308
                    this.swiperCallback(val.slide);
309
                },
310
                deep: true,
311
            },
312
        },
313
        mounted() {
314
            this.$on('closeMoneyTransaction', function () {
315
                this.moneyTransactionControl = false;
316
                this.billsControlApplication();
317
                this.$refs.bills.getBills();
318
            });
319

320
            const StorageObject = new Storage();
321

322
            const currentDateStamp = new Date().getTime();
323

324
            const tommorowDateStamp = currentDateStamp + (86400*1000);
325

326
            let currencyGetStamp = parseInt(StorageObject.get('currentCurrency'));
327

328
            if (StorageObject.get('currentCurrency') === null || currencyGetStamp >= tommorowDateStamp) {
329

330
                StorageObject.add('currentCurrency', currentDateStamp);
331

332
                const CurrencyModel = new Currency();
333

334
                CurrencyModel.fillTable();
335
            }
336

337

338
        },
339
        components: {
340
            DynamicAccumulateChartComponent,
341
            Analytics,
342
            EventsControl,
343
            BarcodeScanner,
344
            MoneyTransaction,
345
            CategoryControl,
346
            FundsControl,
347
            BillsControl,
348
        },
349

350
    }
351
</script>
352

353
<style scoped>
354

355
</style>