<template>
  <div class="redesigned-form-generator-container">
    <FormGeneratorWrapper
      :model="formModel"
      :schema="schema"
      :hide-nulls="true"
      :padded-groups="true"
      class="q-mt-none"
    />
  </div>
</template>

<script lang="ts">
// @ts-nocheck
import FormGeneratorWrapper from '@components/common/node-generator/FormGeneratorWrapper';
import { Vue, Component, Watch, Prop } from 'vue-property-decorator';
import { COMMON_AUTHOR } from '@/constants/schemas';
import cloneDeep from 'lodash/cloneDeep';
import dataBlock from './dataBlock'

const APPLICANT_BASE = `Author_applicantBase`;

@Component({
  components: {
    FormGeneratorWrapper,
    dataBlock
  },
})
export default class FormAuthor extends Vue {
  @Prop() model: any;

  schema = {};
  formModel = {};

  @Watch('model')
  changeModel(val: any): void {
    if (val) {
      this.setFormModel().then((model) => {
        this.formModel = model;
      });
    }
  }

  get applicantSchema() {
    const schema = this.$store.getters['registryService/services/servicesCard'];
    return schema.formsExtra
      ? schema.formsExtra.find((item) => item.name === COMMON_AUTHOR)
      : undefined;
  }

  async setFormModel() {
    if (!this.model) {
      return {};
    }
    if (this.applicantSchema) {
      this.$store.commit(`utils/cards/addSchema`, {
        schema: this.applicantSchema,
        path: 'authorSchema',
      });
      
      this.schema = cloneDeep(this.applicantSchema);
    } else {
      await this.$store
        .dispatch('utils/components/fetchModelByCode', APPLICANT_BASE)
        .then((schema) => {
          this.$store.commit(`utils/cards/addSchema`, {
            schema,
            path: 'authorSchema',
          });
          this.schema = cloneDeep(schema);
        })
        .catch(() => {
          console.warn(
            `[statements/author] Couldn't get schema ${APPLICANT_BASE} `
          );
        });
    }

    return cloneDeep(this.model);
  }
}
</script>
