app_vue2/composables/form/useError.ts

import { AnyJson, AnyStore } from '~/types/interfaces'
import {computed, ComputedRef, useContext} from "@nuxtjs/composition-api";

/**
 * @category composables/form
 * @class UseError
 * Use Classe pour gérer l'apparition de message si le formulaire est dirty
 */
export class UseError {
  private store: AnyStore

  constructor () {
    const {store} = useContext()
    this.store = store
  }

  /**
   * Composition function
   */
  public invoke (field: string, emit: any): AnyJson {
    const error:ComputedRef<Boolean> = computed(()=>{
      return this.store.state.form.violations.indexOf(field) >= 0
    })

    return {
      onChange: (fieldValue:any) => this.onChange(emit, fieldValue, field),
      error
    }
  }

  /**
   *
   */
  private onChange (emit:any, fieldValue:any, changeField:string) {
    const errors = this.store.state.form.violations.filter((field:string) => field !== changeField)
    this.store.commit('form/setViolations', errors)
    emit('update', fieldValue, changeField)
  }
}

export const $useError = (field: string, emit: any) => new UseError().invoke(field, emit)