npm package: @it-enterprise/formio-widget
Description: Для успешной работы пакета, его нужно инициализировать и передать все необходимые зависимости.
Latest version: 1.0.28

### Инициализация пакета в проекте
Для успешной работы пакета, его нужно инициализировать и передать все необходимые зависимости.

```javascript
import formioWidget from '@it-enterprise/formio-widget'

const formioOptions = {
  auth,
  WsUrl: window.appConfig.WsUrl,
  GraphQlUrl: window.appConfig.GrapgQlUrl,
}

let dependencies = {
  i18n,
  axios,
  store,
  router
}

Vue.use(formioWidget, { formioOptions, dependencies })
```

### Работа вместе с PagePlayer

```javascript
import vuetifyWidgets from '@it-enterprise/page-player-vuetify-widgets/src/vuetify-widgets/index'
import { drFormio } from '@it-enterprise/formio-widget'
import pagePlayerPlugin from '@it-enterprise/page-player'

Vue.use(pagePlayerPlugin, {
  datasources: {
  },
  widgets: vuetifyWidgets.concat(drFormio),
  layouts: customLayouts
})
```


### Пример полноценного рабочего main.js
```javascript
import Vue from 'vue'
import App from './App.vue'
import axios from 'axios'
import router from './router'
import store from './store'
import './registerServiceWorker'
import vuetify from './plugins/vuetify'
import './plugins/fontAwesome'
import customLayouts from './layouts/index'

import '@/plugins/graphql'
import { i18n } from './plugins/i18n'
import auth from '@it-enterprise/jwtauthentication'
import Localization from '@it-enterprise/localization'

import vuetifyWidgets from '@it-enterprise/page-player-vuetify-widgets/src/vuetify-widgets/index'
import { drFormio } from '@it-enterprise/formio-widget'
import pagePlayerPlugin from '@it-enterprise/page-player'

import MainLayout from './views/layouts/MainLayout.vue'
import FullPageLayout from './views/layouts/FullPage.vue'
import ExtendedLayout from './views/layouts/ExtendedLayout.vue'
Vue.component('MainLayout', MainLayout)
Vue.component('FullPageLayout', FullPageLayout)
Vue.component('ExtendedLayout', ExtendedLayout)

let dependencies = {
  i18n,
  axios,
  store,
  router
}

Vue.use(Localization, { dependencies })

Vue.use(pagePlayerPlugin, {
  datasources: {
  },
  widgets: vuetifyWidgets.concat(drFormio),
  layouts: customLayouts
})

Vue.config.productionTip = false

auth.config(
  {
    baseUrl: window.appConfig.GrapgQlUrl,
    onError: e => {
      switch (true) {
        case e.response && e.response.status === 400:
          auth.clearTokens()
          store.commit('SET_ERROR', i18n.t('login.credentialWrong'))
          break
        case e.response && e.response.status <= 500:
          store.commit('SET_ERROR', i18n.t('login.loginError'))
          throw new Error(e)
        default:
          break
      }
    }
  }
)

const formioOptions = {
  auth,
  WsUrl: window.appConfig.WsUrl,
  GraphQlUrl: window.appConfig.GrapgQlUrl,
}

import formioWidget from '@it-enterprise/formio-widget'
Vue.use(formioWidget, { formioOptions, dependencies })

new Vue({
  router,
  i18n,
  store,
  vuetify,
  render: h => h(App),
}).$mount('#app')
```
### Обработка запуска процессов
Для возможности обработки процессов, нужно поместить виджет процессов в **DataWidget**. Кнопка запуска процессов генерирует событие **ProccesStarted**, которое можно обработать в **CallAction**(Обработчик событий) методе источника данных. 
В источнике данных в методе **Refresh**(Получение данных) добавляем пустой обект:
```javascript
this.$store.commit(`${this.getStoreModuleName()}/setData`, {})
```
Пример обработки события **ProccesStarted** в методе **CallAction**:
```javascript
if (actionName == 'ProccesStarted') {
    console.log('this is procces: ', parameters)
    if (parameters.result.Success) {
        this.$store.commit('SET_NOTIFY', { text: 'Збережено'})
        this.$router.push({name: 'HomePage'})
        return
    }
}
```
**actionName** - название события.
**parameters** - возвращаемый результат з back-end'а.
Поскольку, источник данных хранит в себе свойства: **$router**, **$route**, **$store**, через **this** мы можем обращатся к ним из метода **CallAction** и писать нужную нам логику для обработки запуска процессов.