<script setup>
import { ref, defineProps } from 'vue';
import FormDisplay from "@/components/displays/FormDisplay.vue";

const props = defineProps({
  department: {
    type: Object,
    required: true
  },
  brand: {
    type: Object,
    required: true
  }
})

const validator_options = ref({
  validateDepartmentId: {
    default: props.department.id,
    locked: true,
    visible: false
  }
})

const field_options = ref({})

const field_attributes = ref({
  name: {
    default: props.brand.name,
  },
  description: {
    default: props.brand.description,
  }
})
</script>

<template>
  <div v-if="props.department.isLoaded()">
    <FormDisplay
        :form_identifier="'MODIFY_BRANDING'"
        v-bind:validator_options="validator_options"
        v-bind:field_options="field_options"
        v-bind:form_field_options="field_attributes"
    />
  </div>
</template>

<style scoped>

</style>