summaryrefslogtreecommitdiff
path: root/addons/point_of_sale/static/src/js/ChromeWidgets/DebugWidget.js
blob: f5158428820030971b4f8e27411311f627cd63ff (plain)
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
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
odoo.define('point_of_sale.DebugWidget', function (require) {
    'use strict';

    const { useState } = owl;
    const { useRef } = owl.hooks;
    const { getFileAsText } = require('point_of_sale.utils');
    const { parse } = require('web.field_utils');
    const NumberBuffer = require('point_of_sale.NumberBuffer');
    const PosComponent = require('point_of_sale.PosComponent');
    const Registries = require('point_of_sale.Registries');

    class DebugWidget extends PosComponent {
        constructor() {
            super(...arguments);
            this.state = useState({
                barcodeInput: '',
                weightInput: '',
                isPaidOrdersReady: false,
                isUnpaidOrdersReady: false,
                buffer: NumberBuffer.get(),
            });

            // NOTE: Perhaps this can still be improved.
            // What we do here is loop thru the `event` elements
            // then we assign animation that happens when the event is triggered
            // in the proxy. E.g. if open_cashbox is sent, the open_cashbox element
            // changes color from '#6CD11D' to '#1E1E1E' for a duration of 2sec.
            this.eventElementsRef = {};
            this.animations = {};
            for (let eventName of ['open_cashbox', 'print_receipt', 'scale_read']) {
                this.eventElementsRef[eventName] = useRef(eventName);
                this.env.pos.proxy.add_notification(
                    eventName,
                    (() => {
                        if (this.animations[eventName]) {
                            this.animations[eventName].cancel();
                        }
                        const eventElement = this.eventElementsRef[eventName].el;
                        eventElement.style.backgroundColor = '#6CD11D';
                        this.animations[eventName] = eventElement.animate(
                            { backgroundColor: ['#6CD11D', '#1E1E1E'] },
                            2000
                        );
                    }).bind(this)
                );
            }
        }
        mounted() {
            NumberBuffer.on('buffer-update', this, this._onBufferUpdate);
        }
        willUnmount() {
            NumberBuffer.off('buffer-update', this, this._onBufferUpdate);
        }
        toggleWidget() {
            this.state.isShown = !this.state.isShown;
        }
        setWeight() {
            var weightInKg = parse.float(this.state.weightInput);
            if (!isNaN(weightInKg)) {
                this.env.pos.proxy.debug_set_weight(weightInKg);
            }
        }
        resetWeight() {
            this.state.weightInput = '';
            this.env.pos.proxy.debug_reset_weight();
        }
        barcodeScan() {
            this.env.pos.barcode_reader.scan(this.state.barcodeInput);
        }
        barcodeScanEAN() {
            const ean = this.env.pos.barcode_reader.barcode_parser.sanitize_ean(
                this.state.barcodeInput || '0'
            );
            this.state.barcodeInput = ean;
            this.env.pos.barcode_reader.scan(ean);
        }
        async deleteOrders() {
            const { confirmed } = await this.showPopup('ConfirmPopup', {
                title: this.env._t('Delete Paid Orders ?'),
                body: this.env._t(
                    'This operation will permanently destroy all paid orders from the local storage. You will lose all the data. This operation cannot be undone.'
                ),
            });
            if (confirmed) {
                this.env.pos.db.remove_all_orders();
                this.env.pos.set_synch('connected', 0);
            }
        }
        async deleteUnpaidOrders() {
            const { confirmed } = await this.showPopup('ConfirmPopup', {
                title: this.env._t('Delete Unpaid Orders ?'),
                body: this.env._t(
                    'This operation will destroy all unpaid orders in the browser. You will lose all the unsaved data and exit the point of sale. This operation cannot be undone.'
                ),
            });
            if (confirmed) {
                this.env.pos.db.remove_all_unpaid_orders();
                window.location = '/';
            }
        }
        _createBlob(contents) {
            if (typeof contents !== 'string') {
                contents = JSON.stringify(contents, null, 2);
            }
            return new Blob([contents]);
        }
        // IMPROVEMENT: Duplicated codes for downloading paid and unpaid orders.
        // The implementation can be better.
        preparePaidOrders() {
            try {
                this.paidOrdersBlob = this._createBlob(this.env.pos.export_paid_orders());
                this.state.isPaidOrdersReady = true;
            } catch (error) {
                console.warn(error);
            }
        }
        get paidOrdersFilename() {
            return `${this.env._t('paid orders')} ${moment().format('YYYY-MM-DD-HH-mm-ss')}.json`;
        }
        get paidOrdersURL() {
            var URL = window.URL || window.webkitURL;
            return URL.createObjectURL(this.paidOrdersBlob);
        }
        prepareUnpaidOrders() {
            try {
                this.unpaidOrdersBlob = this._createBlob(this.env.pos.export_unpaid_orders());
                this.state.isUnpaidOrdersReady = true;
            } catch (error) {
                console.warn(error);
            }
        }
        get unpaidOrdersFilename() {
            return `${this.env._t('unpaid orders')} ${moment().format('YYYY-MM-DD-HH-mm-ss')}.json`;
        }
        get unpaidOrdersURL() {
            var URL = window.URL || window.webkitURL;
            return URL.createObjectURL(this.unpaidOrdersBlob);
        }
        async importOrders(event) {
            const file = event.target.files[0];
            if (file) {
                const report = this.env.pos.import_orders(await getFileAsText(file));
                await this.showPopup('OrderImportPopup', { report });
            }
        }
        refreshDisplay() {
            this.env.pos.proxy.message('display_refresh', {});
        }
        _onBufferUpdate(buffer) {
            this.state.buffer = buffer;
        }
        get bufferRepr() {
            return `"${this.state.buffer}"`;
        }
    }
    DebugWidget.template = 'DebugWidget';

    Registries.Component.add(DebugWidget);

    return DebugWidget;
});