vue-feedback-dialog v0.2.3

vue-feedback-dialog

Feedback dialog for Vue/Vuetify v0.2.3

Install

1. Install Vuetify See documentation

2. Install component:

npm install vue-feedback-dialog --save

Usage

Setup

Import in component (or use global):

import VueFeedbackDialog from 'vue-feedback-dialog'

components: {
    VueFeedbackDialog
}

<VueFeedbackDialog
    :messages="messages"
    :options="options"
    @feedback="handleFeedback"
/>

Messages format: (optional)

      messages: [
        {
          header: 'Maintenance 23.02.20', (h5)
          info: 'Describing text' (p)
        },
        {
          header: 'Down time 10.05.20', (h5)
          info: 'Describing text' (p)
        }
      ]

Options format: (optional)

    defaultOptions: {
        text: {
            headerInfo: 'Information: ',
            headerDialog: 'Report error or suggestion: ',
            dialogLeftControlText: 'Back',
            infoLeftControlText: 'Close',
            dialogRightControlText: 'Send',
            infoRightControlText: 'Report bug',
            reporter: 'Reporter',
            reporterError: 'This field is required',
            description: 'Description...',
            descriptionError: 'This field is required',
            email: 'Email',
            emailError: 'Invalid email address'
        },
        layout: {
            color: '#34495e',
            border: '#34495e',
            background: '#FFF'
        }
    }

Options

Events

Value in feedback event:

    {
        reporter: this.reporter,
        description: this.description,
        path: window.location.href,
        email: this.email
    }

Feedback only mode

If no messages is provided only the feedback form will be visible.

Build:

Compile and build for production

npm run build

Publish to NPM

npm publish

Todo 📌

• Publish to @dsb-norge/vue-feedback-dialog (pending access)