UnivateProperties/src/components/property/residential/singleView/singleResidentialPage.vue

<template>
  <div>
    <!-- <carouselSection :propertyImages="propertyImages" @Loaded="CarouselDone" /> -->
    <main id="main" style="margin-top:20px">
      <contentSection :property="property" :propertyImages="propertyImages" @Loaded="ContentDone" />
    </main>
    <div v-if="Wait" id="preloader"></div>
  </div>
</template>

<script>
/* eslint-disable */

import { mapState, mapActions } from "vuex";
import makeOffer from "../../../processFlow/makeOffer";
import carouselSection from "./carouselSection";
import contentSection from "./contentSection";

export default {
  name: "property",
  components: {
    makeOffer,
    carouselSection,
    contentSection
  },
  data() {
    return {
      index: null,
      date: new Date(),
      boolLoaded: false,
      wait: false,
      carouselLoaded: false,
      contentloaded: false
    };
  },
  async mounted() {
    this.wait = true;
    this.carouselLoaded = false;
    this.contentloaded = false;
    this.clearPropertyImages();
    await this.getDisplayProperty(this.$route.params.id);

    // await this.getPropertyImages(this.$route.params.id);
    // setTimeout(() => {
    //   if (this.propertyImages.length > 0) {
    //     this.boolLoaded = true;
    //   }
    // }, 100);

    //this.mayEditProperty(this.$route.params.id);
  },
  computed: {
    ...mapState("property", ["property", "propertyImages"]),
    Wait() {
      if (this.wait && !this.carouselLoaded && !this.contentloaded) {
        return true;
      }
      return false;
    }
  },
  methods: {
    ...mapActions("property", ["getDisplayProperty", "clearPropertyImages"]),
    ...mapActions("propertyEdit", ["mayEditProperty"]),

    formatPrice(value) {
      const val = (value / 1).toFixed(2);
      return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
    },
    formatAddress(value) {
      if (value !== "") {
        return `${value}<br/>`;
      }
      return "";
    },
    CarouselDone() {
      this.carouselLoaded = true;
    },
    ContentDone() {
      this.contentloaded = true;
    }
  },
  beforeDestroy() {
    this.clearPropertyImages();
  }
};
</script>

<style lang="scss" scoped></style>