Book A Viewing Changed to More Info

src/components/misc/Disclaimer/WebsiteDisclaimer.vue

@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <carouselSection />
+    <main id="main" style="margin-top:-20px;padding-bottom:50px">
+      <contentSection />
+    </main>
+  </div>
+</template>
+
+<script>
+/* eslint-disable */
+import carouselSection from "./carouselSection";
+import contentSection from "./contentSection";
+export default {
+  components: {
+    carouselSection,
+    contentSection
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/misc/Disclaimer/carouselSection.vue

@@ -0,0 +1,46 @@
+<template>
+  <section id="intro">
+    <div class="container">
+      <div class="row">
+        <div align="left" class="col-sm-12 col-md-8">
+          <div class="intro-content box">
+            <h2>Website Dislcaimer</h2>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <carousel
+      :nav="false"
+      :dots="false"
+      :items="1"
+      :autoplay="true"
+      :loop="true"
+      id="intro-carousel"
+      style="margin-top:-50px"
+      :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
+    >
+      <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-2.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-3.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-4.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-5.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-6.jpg" alt="" />
+    </carousel>
+
+    <div id="intro-carousel" class="owl-carousel"></div>
+  </section>
+</template>
+
+<script>
+/* eslint-disable */
+
+import carousel from "vue-owl-carousel";
+export default {
+  components: {
+    carousel
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/misc/WebsiteDisclaimer.vue → src/components/misc/Disclaimer/contentSection.vue

@@ -1,31 +1,27 @@
 <template>
-  <!-- eslint-disable max-len -->
-  <main id="main" style="margin-top:-20px;padding-bottom:450px">
-    <div class="container">
-      <div class="row">
-        <div class="col-sm-12">
-          <div class="section-header">
-            <h2>Website Disclaimer</h2>
-          </div>
-        </div>
-        <div class="col-md-12 text-left">
-          <br />
-          <p style="text-align:left">
+  <div class="container pt-5">
+    <div class="row mb-3">
+      <div class="col-sm-12 col-md-6">
+        <p style="text-align:left">
             Since the Company has limited control over the information and variables provided by
             users the Company accepts no responsibility for any loss or damage of whatsoever nature
             that may be caused or brought about, directly or indirectly, by the use of this Website
             or reliance on any information contained therein.
-          </p>
-          <p class="text-left">
+        </p>
+      </div>
+      <div class="col-sm-12 col-md-6">
+        <p style="text-align:left">
             Any person who feels prejudiced by any information or variables contained on this
             Website shall look to the persons who provided such information in case of any action
             being taken.
-          </p>
-        </div>
+        </p>
       </div>
     </div>
-  </main>
+  </div>
 </template>
+
 <script>
 export default {};
 </script>
+
+<style lang="scss" scoped></style>

src/components/property/commercial/enquireNow/carouselSection.vue

@@ -0,0 +1,46 @@
+<template>
+  <section id="intro">
+    <div class="container">
+      <div class="row">
+        <div align="left" class="col-sm-12 col-md-8">
+          <div class="intro-content box">
+            <h2>More Info</h2>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <carousel
+      :nav="false"
+      :dots="false"
+      :items="1"
+      :autoplay="true"
+      :loop="true"
+      id="intro-carousel"
+      style="margin-top:-50px"
+      :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
+    >
+      <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-2.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-3.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-4.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-5.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-6.jpg" alt="" />
+    </carousel>
+
+    <div id="intro-carousel" class="owl-carousel"></div>
+  </section>
+</template>
+
+<script>
+/* eslint-disable */
+
+import carousel from "vue-owl-carousel";
+export default {
+  components: {
+    carousel
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/property/commercial/enquireNow/contentSection.vue

@@ -0,0 +1,92 @@
+<template>
+  <div class="container pt-5">
+        <div class="row mb-8">
+          <div class="col-md-6">
+            <form action="mailto:info@univateproperties.co.za" method="post" enctype="text/plain">
+              <div class="form-group row">
+                <div class="col-md-6">
+                  <div class="input-group-prepend">
+                    <span class="input-group-text">
+                      <eva-icon name="person" fill="#60CBEB"></eva-icon>
+                    </span>
+                    <label for="yourname"></label>
+                    <input
+                      id="yourname"
+                      name="yourname"
+                      placeholder="Your Name"
+                      type="text"
+                      required="required"
+                      class="form-control"
+                    />
+                  </div>
+                </div>
+                <div class="col-md-6">
+                  <div class="input-group-prepend">
+                    <span class="input-group-text">
+                      <eva-icon name="email" fill="#60CBEB"></eva-icon>
+                    </span>
+                    <label for="youremail"></label>
+                    <input
+                      id="youremail"
+                      name="youremail"
+                      placeholder="Your Email"
+                      type="text"
+                      required="required"
+                      class="form-control"
+                    />
+                  </div>
+                </div>
+              </div>
+              <div class="form-group row">
+                <div class="col-md-12">
+                  <div class="input-group-prepend">
+                    <span class="input-group-text">
+                      <eva-icon name="bookmark-outline" fill="#60CBEB"></eva-icon>
+                    </span>
+                    <label for="subject"></label>
+                    <input
+                      id="subject"
+                      name="subject"
+                      placeholder="Subject"
+                      type="text"
+                      class="form-control"
+                      required="required"
+                    />
+                  </div>
+                </div>
+              </div>
+              <div class="form-group row">
+                <div class="col-md-12">
+                  <div class="input-group-prepend">
+                    <span class="input-group-text">
+                      <eva-icon name="message-square-outline" fill="#60CBEB"></eva-icon>
+                    </span>
+                    <label for="message"></label>
+                    <textarea
+                      id="message"
+                      name="message"
+                      placeholder="Message"
+                      cols="40"
+                      rows="8"
+                      class="form-control"
+                      required="required"
+                    ></textarea>
+                  </div>
+                </div>
+              </div>
+              <div class="form-group row">
+                <div class="col-md-1">
+                  <button name="submit" type="submit" class="btn btn-b-n">Send Message</button>
+                </div>
+              </div>
+            </form>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="scss" scoped></style>

src/components/property/commercial/enquireNow/enquirenow.vue

@@ -0,0 +1,22 @@
+<template>
+  <div>
+    <carouselSection />
+    <main id="main" style="margin-top:-20px;padding-bottom:50px">
+      <contentSection />
+    </main>
+  </div>
+</template>
+
+<script>
+/* eslint-disable */
+import carouselSection from "./carouselSection";
+import contentSection from "./contentSection";
+export default {
+  components: {
+    carouselSection,
+    contentSection
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/property/commercial/singleView/contentSection.vue

@@ -27,11 +27,10 @@
 
           <div class="panel-left p-5" style="margin-top:140px; margin-bottom:50px">
             <h2>Property Detial</h2>
-            <p>{{ property.addressLine1 }}</p>
-            <p>Town, Suburb</p>
+            <!-- <p>{{ property.addressLine1 }}</p>
+            <p>Town, Suburb</p> -->
             <p>{{ property.shortDescription }}</p>
-            <p>{{ property.price }}</p>
-            <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
+            <!-- <p>{{ property.price }}</p> -->
           </div>
         </div>
         <div class="col-md-8 p-5 resort-profile">
@@ -55,7 +54,9 @@
                   <td>Second Floor</td>
                   <td>yes</td>
                   <td>open plan</td>
-                  <td><a href="#" class="btn-solid-blue">BOOK A VIEWING</a></td>
+                  <td>
+                    <router-link to="/EnquireNow">More Info</router-link>
+                  </td>
                 </tr>
                 <tr>
                   <td>#123456</td>
@@ -63,14 +64,14 @@
                   <td>Top Floor</td>
                   <td>yes</td>
                   <td>open plan</td>
-                  <td><a href="#" class="btn-solid-blue">BOOK A VIEWING</a></td>
+                  <td><router-link to="/EnquireNow">More Info</router-link></td>
                 </tr>
               </tbody>
             </table>
           </div>
           <p></p>
 
-          <div class="d-flex mt-3">
+          <!-- <div class="d-flex mt-3">
             <iframe
               width="100%"
               height="200"
@@ -81,7 +82,7 @@
               marginheight="0"
               marginwidth="0"
             ></iframe>
-          </div>
+          </div> -->
         </div>
       </div>
     </div>

src/router/index.js

@@ -48,7 +48,7 @@ import UnitPage from "../components/timeshare/resort/unit/unitPage.vue";
 
 import ContactUs from "../components/misc/contactUs.vue";
 import PrivacyPolicy from "../components/misc//privacyPolicy/privacyPolicyPage.vue";
-import WebsiteDisclaimer from "../components/misc/WebsiteDisclaimer.vue";
+import WebsiteDisclaimer from "../components/misc/Disclaimer/WebsiteDisclaimer.vue";
 
 import MakeOffer from "../components/processFlow/makeOffer.vue";
 import Offer from "../components/processFlow/offers.vue";
@@ -71,6 +71,7 @@ import LandingPage from "../components/marketing/landingPage.vue";
 import LandingPageWeek from "../components/marketing/landingPageWeek.vue";
 import MarketingPage from "../components/marketing/clientView.vue";
 import MarketingPageExp from "../components/marketing/landingPageExpired.vue";
+import EnquireNow from '../components/property/commercial/enquireNow/enquirenow.vue';
 
 Vue.use(Router);
 
@@ -393,6 +394,11 @@ export default new Router({
       path: "/CampaignExpired",
       name: "CampaignExpired",
       component: MarketingPageExp
+    },
+    {
+      path: "/EnquireNow",
+      name: "EnquireNow",
+      component: EnquireNow
     }
   ]
 });