<template>
    <div>
        <p class="title is-6 m-0 py-4" v-if="customFields.length > 0">{{ $t('text.additional_informations') }}</p>

        <b-field v-for="(field, index) in customFields" 
                    :key="index"
                    :label="field.name"
                    :type="{'is-danger':errors.has(field.code)}"
                    :message="errors.collect(field.code)">

            <b-input v-model="field.value" 
                    :name="field.code" 
                    v-validate="(field.required)?'required':''"
                    @input="onInputField">
            </b-input>

        </b-field>

    </div>
</template>

<script>
export default {
  name: "LeanispInputCustomField",
  created() {
      if (this.$store && this.documentName) {
          this.customFields = this.$store.getters.getAvailableCustomFieldsByList(this.documentName);
          this.onInputField()
      }
  },
  props: ["documentName"],
  data() {
      return {
        customFields: []
      }
  },
  methods: {
      onInputField () {
          let fieldList = []
          fieldList = this.customFields
            // .filter((field) => { return field.value !== undefined && field.value !== ''})
            .map((field) => {
                return {
                    code: field.code,
                    name: field.name,
                    type: field.type,
                    value: field.value
                }
            })
          this.$emit('input', fieldList);
      }
  }
}
</script>
