Vue form analytics mixin

analytics.js

import { mapActions } from 'vuex'

export default {
    methods: {
        ...mapActions([
            'updateInputFocus',
        ]),

        lastInputFocus(e) {
            if (!e.srcElement.name) return
            this.updateInputFocus(e.srcElement.name)
        },

        setFocusListner() {
            this.$nextTick(() => {
                this.$el.querySelectorAll('input').forEach((input) => {
                    input.addEventListener('focus', this.lastInputFocus)
                })

                this.$el.querySelectorAll('textarea').forEach((input) => {
                    input.addEventListener('focus', this.lastInputFocus)
                })
            })
        },

        sendAnalytics() {
            this.$http.post(this.analyticsEndpoint, {
                type: this.analyticsType,
                data: {
                    ...this.analytics,
                    errors: this.errors.map(error => ({ text: error })),
                },
            })
        },
    },
}