cropper

// utils.js

    b64toBlob(base64) {
      return new Promise((resolve, reject) => {
        fetch(base64)
          .then(res => res.blob())
          .then(res => resolve(res))
          .catch(reject)
      })
    },
    async asyncForEach(array, callback) {
      for (let index = 0; index < array.length; index++) {
        await callback(array[index], index, array);
      }
    },
    async UrlToBase64(url) {
      return new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest();
        xhr.onload = () => {
            var reader = new FileReader();
            reader.onloadend = () => resolve(reader.result)
            reader.readAsDataURL(xhr.response);
        };
        xhr.open('GET', url);
        xhr.responseType = 'blob';
        xhr.send();
      })
    },
    async UrlsToBase64(urls) {
      let vm = this

      return Promise.all(urls.map(async item => await vm.UrlToBase64(item.url)))
    },
    getFileExtension(fileUpload) {
      let split = fileUpload.name.split('.')
      if (split.length >= 2) {
        return split.pop();
      } else {
        return 'txt'
      }
    },

// outros métodos

    setMoneyValue(ref, value) {
      this.$nextTick(function (){
        value = this.formatMoney(value)
        this.$refs[ref].$el.getElementsByTagName('input')[0].value = value
        this.property[ref] = value
      })
    },
    async setImage(e) {
      const file = e.target.files[0];

      if(!file) return;

      const ext = this.getFileExtension(file)

      // Caso a imagem não esteja em formato válido
      if(!ext.match(/(jpg|jpeg|png)$/i)) {
        this.profile_picture = null
        return this.$store.commit('setDialog', {
                  message: 'Formato de imagem inválido. Formatos aceitos: jpg, jpeg, png',
                  status: -1
                })
      }

      const reader = new FileReader();
      reader.onload = (event) => {
        this.imgSrc = event.target.result;
        this.$refs.cropper.replace(event.target.result);
      }

      reader.readAsDataURL(file);

      this.add_photo_dialog = true;
    },
    saveCrop() {
      this.property.files.push(this.$refs.cropper.getCroppedCanvas().toDataURL())

      this.add_photo_dialog = false

      this.carousel_model = this.property.files.length - 1
    },

// created()

    const { data } = await this.axios.get('condominium-places')

    this.condominium_places = data

    if(!this.isNew) {
      const { data } = await this.axios.get(`property/${this.id}`)

      this.property = {
        ...data,
        files: await this.UrlsToBase64(data.files),
        places: data.places.map(item => item.condominium_places_id)
      }

      this.setMoneyValue('rent_price', this.property.rent_price)
      this.setMoneyValue('condominium_price', this.property.condominium_price)
      this.setMoneyValue('iptu', this.property.iptu)
      this.setMoneyValue('fire_insurance', this.property.fire_insurance)
    }

// submit

      let formData = new FormData()

      const upload = async () => {
        await this.asyncForEach(this.property.files, async(file, i) => {
          let blob = await this.b64toBlob(file.base64)

          formData.append(`photo[${i}]`, blob)
        })
      }

      await upload()

      let property_id

      if(this.isNew) {
        const { data } = await this.axios.post('property', req)

        property_id = data
      }
      else {
        await this.axios.put(`property/${this.id}`, req)

        property_id = this.id
      }

      await this.axios.post(`property/${property_id}/upload`,
        formData,
        {
          headers: {
            'Content-Type': 'multipart/form-data'
          },
        }
      )