Allow to edit an animal or remove animal + add missing fields

[omiras]

If the app navigates to /editanimal/:id ; the app should display the add animal form in edit mode.

  {
    path: '/editanimal/:id',
    component: () => import('@/views/AddNewAnimal.vue')
  }

1. All the fields of the form must be filled with the current information about the animal
2. User can change any information and it should be updated in the database
3. User should be able to remove the animal from the adoption workflow. We may display a button disable

Missing forms fields

Please add these fields to the form to add a new animal or edit it:

1. Size
2. Adoption type

In addition, this data should be also set to the new animal:

3. creation date
4. disable date

[omiras]

1. En la vista, AddNewAnimal.vue. tenemos que detectar si hemos accedido por querer editar un animal o por crear uno de nuevo
2. Asociad una nueva propiedad a ; que sea el Id del animal (si es porque queremos editarlo!). La propiedad la podeis poner de manera dinamica y rellenarla dede el data() { idAnimal: '' }
3. IonWillEnter-> se va a encargar de actualizar this.idAnimal si es que queremos editar el animal (si params.id tiene valor)
4. Si en el componente el valor de la propiedad idAnimal es diferente a vacio, ya sabemos que estamos en modo edición.
   • en el created de la vista, llamad a getAnimals

• En Vuex, crear un getter para que filtre por id de animal
• El componente debe usar este getter en el caso de que idAnimal sea informada
  5. Una vez has recuperado los datos de tu animal en el componente, ya puedes mapear cada uno de los campos en el formulario.
  6. Como idAnimal está informado, sabreis que teneis que actualizar el animal (el document) en vez de insertar uno nuevo.